View Full Version : stretch vertical border to full length of page

08-12-2010, 03:44 PM
i wish for the 'main' middle part of the page to have a left and right border that fills the entire page. if the page is longer than then the border does not stretch to the end of the page.

how do i get it so it is the ful length of the page no matter what the content is.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="robots" content="noindex,nofollow">
body { padding:0 0 20px 0; background-color: #fff; background:url(../images/bgx.gif) repeat-x; margin:0 auto; width:100%; min-width: 890px; font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#666; }

#header { margin:0; padding:20px 0 0 60px; position:relative; height: 60px; }
#header ul { list-style:none; margin:0; padding:0; position:relative; }
#header li { float:left; margin:0; padding: 0 8px 0 8px; position:relative; color:#000; }

.mmcontent { color:#999; }

.copyright2010 { float: left; width: 50%; text-align: center; font-size:8pt; line-height: 30px; }


<body style="width:1000px; width: 50%; margin-left: auto; margin-right: auto;">
<div id='header'>
<li><a href=''>HOME</a></li>
<li><img src="images/split.gif" height="16" width="1" alt=""></li>
<li class='hovmode'><a href=''>Show Request</a></li>
<li><img src="images/split.gif" height="16" width="1" alt=""></li>
<li><a href=''>LOG OUT</a></li>
<div style="width:800px; padding-right: 3px; padding-left: 3px; height:100%; min-height: 500px; border-left:#999 1px solid; border-right:#999 1px solid;">
<div class='mmcontent'>
<div class='mhbox'><h2>Admin - Show Requests</h2><br />
<div class='mmcpad'>
<div class="formspacer"><a href="">info</a><br></div>
<br /><br />
<br style="clear:both" />
<div class="copyright2010">my left footer</div>
<div class="copyright2010">my right footer</div>