Iam trying to get the green footer div to sit on the bottom of all
three divs so as the divs vary in height it sits off the bottom of the
lowest one
I cannot use absolutes because the three colum are dynamically driven
maybe Iam missing something really simple?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://wwww3.org/TR/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<html>
<head>
<title></title>
<style type="text/css">
#bigcontainer {
margin: 0px auto;
width: 768px;
position: relative;
border: thin solid Fuchsia;
}
#left{
width: 164px;
position: absolute;
border: thin solid #00008B;
}
#middle{
left: 169px;
width: 430px;
position: absolute;
border: thin solid Red;
}
#right{
left: 604px;
width: 164px;
position: absolute;
border: thin solid #00008B;
}
#footer{
margin: 0px auto;
clear: both;
width: 768px;
position: relative;
border: thin solid #32CD32;
}
</style>
</head>
<body>
<div id="bigcontainer">
<div id="left"><img src="/" width="164" height="250" alt=""
border="0"></div>
<div id="middle"><img src="/" width="430" height="200" alt=""
border="0"></div>
<div id="right"><img src="/" width="164" height="250" alt=""
border="0"></div>
<div id="footer"> </div>
</div>
</body>
</html>
