Forum Moderators: not2easy
#Heading {
background-image: url('image.jpg');
background-repeat:repeat;
width: 100%;
min-width: 784px;
margin: 0px;
padding: 0px;
height: 130px;
overflow:hidden;
}body {
margin: 0px;
padding-left: 0;
padding-right: 0;
background-color: #FFFFFF;
}
#container {
width:expression(document.body.clientWidth < 778? "780px" : "100%" );
min-width: 778px;
border: 0;
margin: 0px 0px 10px 0px;
padding: 0px 0px 10px 0px;
background-color: #FFFFFF;
}
#content {
padding: 3px;
margin-top: 3px;
margin-left: 138px;
margin-right: 274px;
background-color: #FFFFFF;
}
#left {
float: left;
width: 135px;
\width: 135px;
w\idth: 135px;
margin: 0;
padding: 0px;
border-right: 1px solid #000000;
background-color:#c0c0c0;
}
#right {
float: right;
width: 271px;
margin: 0;
padding: 0px;
border-left: 1px solid #000000;
background-color:#c0c0c0;
}
#footer {
margin:6px 0px 0px 0px;
clear: both;
padding: 1px 0px 0px 0px;
background-image: url('image.jpg');
background-repeat: repeat-x;
background-color: #000000;
}
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Test Page</title>
</head>
<body>
<div id="container">
<div id="Heading">
Heading Image
</div>
<div id="left">
Left Content
</div>
<div id="right">
Right Content
</div>
<div id="content">
Middle content
</div>
</div>
<br/>
<div id="footer">
Footer text
</div>
</body>
</html>
This works fine in firefox.
I don't know if this makes a difference but the content, left and right divs are all included in PHP so that I can update the files accordingly and have the index as a template.