Jump to content

Need help with layout including images


WebDesignMike

Recommended Posts

Hello everybody!

 

I am going to try to explain this the best i can without confusing everybody :lol:

 

I am trying to create a textured background that will sit "behind" the site banner at the top of the page. like this: www.tymeout.org

 

Notice that at www.tymeout.org when I grab the resize on the left or right of the browser and resize the browser - the textured image STAYS WITH the banner at the top. meaning the design on the bg image stays right with the center banner regardless of how small or large my browser window is.

 

When I set a static bg image for my site and then center a banner in a table, when i resize the browser my banner and background image do not move together, the center banner just floats over the static bg image. This becomes a problem when I have a textured design that starts on the bg image and continues through the center banner to the other side. As soon as the browser is resized - bam it doesnt match up anymore because the center banner just floats over the static bg image. I hope this makes sense.

 

Thanks in advance your help!

Link to comment
Share on other sites

If you look at the code for the site you mention, you'll find that there are TWO background images. One's attached to the body and grows along with the browser window, the other is attached to the header div and will always be the size of that div.

 

And what do you mean 'center a banner in a table'? You should not be using tables for your layout. That's what CSS positioning is for. Tables are for tabular data.

Link to comment
Share on other sites

If you look at the code for the site you mention, you'll find that there are TWO background images. One's attached to the body and grows along with the browser window, the other is attached to the header div and will always be the size of that div.

 

And what do you mean 'center a banner in a table'? You should not be using tables for your layout. That's what CSS positioning is for. Tables are for tabular data.

 

After a little research I realise I need to do the whole layout using CSS, but I don't know how. Is there a particular site or tutorial you would recommend or me to learn doing layouts with CSS? The float:left and absolute positioning and z-index stuff, i dont understand any of that lol. Thanks for the quick reply!

Link to comment
Share on other sites

Scroll to the top of this page and look at what's available under the dropdown for the Killersites Network - there are several sites with excellent info.

 

BTW - z-index is rarely needed and ofter misunderstood - Here's a tutorial from that Network on this topic: http://www.csstutorial.net/2010/06/using-the-css-z-index/

 

But focus on the basics first.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...