Forum Moderators: not2easy
There are a few pages on a site of mine where the divs that contain the header and footer do not resize to fill the page (liquid) where an image exceeds the width of the browser window. (I cannot change the image size!)
I am using IE 5.5 like all the other poor souls within our organisation.
<html>
<head>
<style type="text/css">
#mainlinks {
font-family: Arial, Helvetica, sans-serif;
font size: 0.8em;
color: #ffffff;
padding-top: 5px;
padding-bottom: 5px;
padding-left: 15px;
background-color: #cc0000;
border-top: 1px solid #000000;
border-bottom: 1px solid #000000;
}
#footer {
font: 0.7em Arial, Helvetica, sans-serif;
color: #000000;
background-color: #e8e8e8;
padding-top: 10px;
padding-right: 5px;
padding-bottom: 10px;
padding-left: 15px;
border-top: 1px solid #000000;
border-bottom: 1px solid #000000;
margin-bottom: 35px;
margin-top: 20px;
margin-bottom: 35px;
}
</style>
</head>
<body leftmargin="0" topmargin="0">
<div id="mainlinks">
<a href="index.htm">Home</a> ¦
<a href="whatsnew.htm">What's New</a>
etc etc
</div>
<img src="case.gif" width="2000" height="300">
<div id="footer">
<a href="index.htm">Home</a> ¦
<a href="whatsnew.htm">What's New</a>
etc etc
</div> </body></html>
I have tried adding the width: 100% property to no avail. Hope I have included enough info for this problem to make sense. Probably something really simple :)
Ta
Limbo
P.S.The CSS is in long hand so that 'anyone' can update it.
<edit> Altered to make Viewing Easier</edit>
Still learning so if i am wrong i apologise :)