I'm trying (again) to make a css design. I know there's loads of bugs in all browsers with css so i've been looking for a site which will give me a simple structure. I saw the topic with this. For some reason when i copy and paste the code and view it, the heights are all wrong for all browsers.

 

Can someone test it out for me? this is a copy of the code which looks different for me.

 

By the way, i made a copy of one of those templates with tables and tables take up pretty much exactly the same amount of space as divs do. I don't understand why 10 more bits make a difference when you have the hassle of browser bugs.

 

Thanks, Peter

Try changing your content id to:

 

#content { 
margin-left:210px;
width:540px;
min-height:500px; /* for modern browsers */
height:auto !important; /* for modern browsers */
height:500px; /* for IE5.x and IE6 */
background-color:#333333;
}

 

All I did was remove the 10px margin from the top.

I just saw this comment:

 

IMPORTANT: In order to make this work you have to download http://csseasy.com/layouts/fixed/background_3.gif (copy past in your address bar) and place it in the same folder as this html file. DON'T HOTLINK to this file.

 

Don't think that's exactly a fix..Removing that margin did work though i think.

 

Thanks

 

(later)

 

I'm getting this problem i think that gif's supposed to fix. On opera and firefox, when the content div has content in which makes the div higher than the nav bar the margin between the content and footer is too big. Is there a better way to fix this than having a picture to fill the space?