WebDesignMike Posted August 23, 2011 Report Posted August 23, 2011 Hello everybody! I am going to try to explain this the best i can without confusing everybody 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! Quote
Andrea Posted August 23, 2011 Report Posted August 23, 2011 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. Quote
WebDesignMike Posted August 23, 2011 Author Report Posted August 23, 2011 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! Quote
Andrea Posted August 23, 2011 Report Posted August 23, 2011 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. Quote
Recommended Posts
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.