I cant make the white area stretch downwards. I'd like it too look like this:
See how the white parts continues with the content, and stops when the content stops? I want it to work just like that.
My coding however, looks horrible. See how the white part just stops ... in the middle of everything, regardless of the content still continuing downwards.
You're using absolute positioning where you don't need to. Remember that absolute positioning removes the element from normal flow and should only be used when you ... well, absolutely need to do so.
All you need to do is to create a 725 x 1 pixel image containing nothing but the white background color and then add this to your CSS:
Code:
body {
background: URL(../images/white-background) top center repeat-y #DBD8D1;
color: inherit;
}
If you want to, at that point you can then add a div to create that top header background. It will overlap initially, but then you can create a nested div with your white background and away you go. That's a lot easier to do than it sounds, by the way...you'll just have to try it to see what I'm talking about.
You're also right in that your code is a mess. If I were you, I'd look at blowing it up and starting again from scratch. You're all over the map with it.
If I create a white bg then the other darker bg disappears.
It sounds complicated, I've no idea how to achieve that
Quote:
Originally Posted by ADAM Web Design
If you want to, at that point you can then add a div to create that top header background. It will overlap initially, but then you can create a nested div with your white background and away you go. That's a lot easier to do than it sounds, by the way...you'll just have to try it to see what I'm talking about.
Quote:
Originally Posted by ADAM Web Design
You're using absolute positioning where you don't need to. Remember that absolute positioning removes the element from normal flow and should only be used when you ... well, absolutely need to do so. /../ You're also right in that your code is a mess. If I were you, I'd look at blowing it up and starting again from scratch. You're all over the map with it.
Like I said I'm new to divs, I don't know any other way, so if I'd start from scratch it'd look the same :/
Think if it as 'layering' with divs. You put the darker background on the body or a 'container' div. Then, inside that, you create another div with the white background.
Something like this:
<div id="container">
<div id="content">
content here
</div> <!-- end content area -->
</div><!-- end wrapper -->
In your CSS:
#container{
width: 800px;
background: #000000;
margin: 0 auto /*centers the fixed width content area */
}
#content{
width: 560px;
background: #fff;
}
__________________
Web Goddess & Web Standards Evangelist :) - Tables Be Gone !!
