Forum Moderators: not2easy
All versions of Netscape do not show the red, they remain transparent. I have no idea why this is or how to fix it. Does anyone have any idea? (as an aside, this is my first post here, so let me know if I need to provide more info.)
Below is the relevant code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN">
<head>
<style>
body {
background-image: none;
margin: 0px;
background-color: #8b726f;
width:760px;
}
#container {
background-color:red;
width: 760px;
margin: 0 auto;
padding-top: 0px;
position:relative;
}
div#leftnav {
width: 160px;
height: 100%;
margin: 0;
padding: 0;
float:left;
}
div#bodyContainer {
float: left;
width: 600px;
height: 100%;
}
div.column1 {
float: left;
width: 368px;
padding: 0 10px 10px 10px;
}
div.column2 {
height: 100%;
float: right;
width: 180px;
padding: 0 10px 10px 10px;
}
</style>
</head>
<body>
<div id="container">
<div id="leftnav">
<h2>Left navigation </h2>
</div>
<div id="bodyContainer">
<div class="column1">
<h2>Center column </h2>
</div>
<div class="column2">
<h2>Right Column </h2>
</div>
</div>
</div>
</body>
</html>
Other than that, I can't say much except this: Netscape is now a pretty lousy browser, and hardly anyone uses it. I wouldn't really worry about it if I were you, it's like catering to Win3.1 users. (granted, I know there's some very new versions of Netscape around)
[edited by: Xapti at 5:20 am (utc) on May 10, 2007]
Xapti is right about the Doctype, which may go on to cause other problems with floated layouts for you, so perhaps you might like to read up on them:
for this problem I though I think you may just need to contain your floats. Floated elements are well, floating ;) not really there, and their container div no longer knows they exist, so it doesn't know to stretch to clear them, which is possibly why your background is 'missing'
IE as you will read is likely doing it because of it's quirks ;) there are ways to clear floats properly, either by floating the container itself, or you can add something like
<br style="clear: both;">overflow: auto;Clearing elements used to be used abundantly because support for the overflow method was/is not quite complete, and if you really are using Netscape 6/7, I think that is one of the browsers that does not support overflow. You may also want to take a look for the "easyclearing" method on P.I.E. - I still have that method in place in some s/sheets because of Netscape. Between using it and overflow I find you can clear the floats without clearing divs (extra HTML) usually.
Suzy
