No replies
nickjamesd
Offline
newbie
Last seen: 13 years 3 weeks ago
Timezone: GMT+1
Joined: 2009-07-07
Posts: 2
Points: 0

Hello All
Can anybody explain why in ie6 the footer covers up the border of the containing div, if i re-size the window it re-appears but goes again upon a refresh.
ok in firefox.

many thanks, all advice most welcome.

<!DOCTYPE html
	PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
	 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en-US" xml:lang="en-US">
<head>
<title>Untitled Document</title>
<link rel="stylesheet" type="text/css" href="server_mon_style.css" />
<script src="JS.js" type="text/javascript"></script>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
</head>
<body>
<div id="container"><div id='banner'><h1>Server Monitoring Tool</h1></div><div id='nav'><p>Select Options</p><form method="post" action="/MAIN1.cgi" enctype="multipart/form-data">
<input type="button" tabindex="1" name="1. Select Graph Type" value="1. Select Graph Type" onclick="document.location = &quot;MAIN1.cgi&quot;"  /><br /><br /><div></div></form><form method="post" action="/MAIN1.cgi" enctype="multipart/form-data">
<input type="button" tabindex="2" name="2. Select Servers" value="2. Select Servers" onclick="document.location = &quot;MAIN2.cgi&quot;"  /><br /><br /><div></div></form><form method="post" action="/MAIN1.cgi" enctype="multipart/form-data">
 
<input type="button" tabindex="3" name="3. Select Parameters" value="3. Select Parameters" onclick="document.location = &quot;MAIN3.cgi&quot;" disabled="disabled" /><br /><br /><div></div></form><form method="post" action="/MAIN1.cgi" enctype="multipart/form-data">
<input type="button" tabindex="4" name="4. Select Graph Feature" value="4. Select Graph Feature" onclick="document.location = &quot;MAIN4.cgi&quot;" disabled="disabled" /><br /><br /><div></div></form><form method="post" action="/MAIN1.cgi" enctype="multipart/form-data">
<input type="button" tabindex="5" name="5. Draw Graph" value="5. Draw Graph" onclick="document.location = &quot;MAIN5.cgi&quot;" disabled="disabled" /><br /><br /><div></div></form><form method="post" action="/MAIN1.cgi" enctype="multipart/form-data">
<input type="button" tabindex="6" name="6. Display Data" value="6. Display Data" onclick="document.location = &quot;MAIN6.cgi&quot;" disabled="disabled" /><br /><br /><div></div></form></div><div id='content'>This is under the content div<h1>Select the graph type</h1><form method="post" action="MAIN2.cgi" enctype="multipart/form-data" onsubmit="return validate()" name="checkbox_form">
<label><input type="radio" name="oneormany" value="single" checked="checked" tabindex="7" />single</label><label><input type="radio" name="oneormany" value="many" tabindex="8" />many</label><p /><input type="submit" tabindex="9" name=".submit" /><div><input type="hidden" name=".cgifields" value="oneormany"  /></div></form></div><div id='history'><h2>Selected options</h2><span class='historytitle'>Selected Graph Type
<span class='historyresult'>single
</span>Selected Servers<span class='historyresult'>
</span>Selected Parameters<span class='historyresult'>
</span>Specific Parameters<span class='historyresult'></span></span></div><div id='footer'>Footer stuff here</div></div>
 
</body>
</html>

Stylesheet

* {margin:0;padding:0}
 
#body
{
margin: 0;
padding: 0;
color: #000;
background-color: #8e8f27;
}
 
#footer
{
position:relative;
bottom:-32px;
clear:both;
background-color: #CCCCCC;
text-align: center;
width:100%;
border-top: 1px solid #333;
z-index:-1;
zoom:1;
}
 
#content
{
	float:left;
padding-top: 10px;
padding-bottom: 5px;
padding-left: 30px;
border: 1px solid #333;
position: relative;
left:29px;
width:340px;
overflow: auto;
height:70%;
background-color: #99CCCC;
}
 
#nav
{
float: left;
width: 220px;
position:relative;
left:30px;
padding-top: 10px;
padding-bottom: 5px;
padding-left: 10px;
border: 1px solid #333;
height:70%;
overflow: auto;
}
 
 
.historytitle
{
	text-align:center;
	display:block;
	font-size: 17px;
	color: black;
	background-color: blue;
}
 
.historyresult
{
	display:block;
	font-size: 14px;
	text-align:left;
	background-color: red;
}
#banner
{
margin: 0;
padding: 5px;
}
 
#container
{
width:900px;
height:25em;
position : relative;
left:30px;
top: 60px;
background-color: #669999;
/*overflow: hide;*/
border: 1px solid #333;
z-index:1;
}
#history
{
padding-top: 10px;
padding-bottom: 5px;
float :left;
width:205px;
position:relative;
left: 28px;
border: 1px solid #333;
overflow: auto;
height:70%;
}