XOXO
15 Aug 2005, 05:05 PM
I am having problem with two horizontal divs (one on top of the other) which are inside a table data. Both css and html validate. When browsing with normal size of the window, there is no problem. The background color of the body shows up at the bottom of the page when resizing the window in firefox. Opera acts funny, after I resize the window and back to normal or refresh. IE is doing what I expect.
Any idea?
here it is the code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title></title>
<style type="text/css">
html,BODY {
BACKGROUND-COLOR: red;border:none;margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;width:100%;height:100%;min-
height: 100%;
}
#left {
LINE-HEIGHT: 20px; FONT-FAMILY: Arial,Times New Roman,SANS-SERIF; BACKGROUND-COLOR: #6699cc; TEXT-ALIGN:
left;height:auto
}
#topdiv {height:90%;width:100%;text-align:center;float:left;background-color:yellow}
#botdiv {height:10%;width:100%; text-align:center;background-color:blue;clear:left;}
#bott {
HEIGHT: 100%;
}
</style>
<META http-equiv=Content-Type content="text/html; charset=utf-8">
</head>
<body>
<TABLE id=bott cellSpacing=0 cellPadding=0 width="100%" >
<TR>
<TD id=left >
<div id=topdiv><br><br>top div
</div>
<div id=botdiv> bottom div bmhghmg <br>
hbgfhgsn gfjnghmg fhmjh ,mhgmjh h mhmhdg <br>
hg mghm</div>
</TD></tr></table>
</body>
</html>
Any idea?
here it is the code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title></title>
<style type="text/css">
html,BODY {
BACKGROUND-COLOR: red;border:none;margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;width:100%;height:100%;min-
height: 100%;
}
#left {
LINE-HEIGHT: 20px; FONT-FAMILY: Arial,Times New Roman,SANS-SERIF; BACKGROUND-COLOR: #6699cc; TEXT-ALIGN:
left;height:auto
}
#topdiv {height:90%;width:100%;text-align:center;float:left;background-color:yellow}
#botdiv {height:10%;width:100%; text-align:center;background-color:blue;clear:left;}
#bott {
HEIGHT: 100%;
}
</style>
<META http-equiv=Content-Type content="text/html; charset=utf-8">
</head>
<body>
<TABLE id=bott cellSpacing=0 cellPadding=0 width="100%" >
<TR>
<TD id=left >
<div id=topdiv><br><br>top div
</div>
<div id=botdiv> bottom div bmhghmg <br>
hbgfhgsn gfjnghmg fhmjh ,mhgmjh h mhmhdg <br>
hg mghm</div>
</TD></tr></table>
</body>
</html>