need help with three column layou
Posted: Fri Sep 08, 2006 2:15 am
I'm having trouble positioning the right column for this page (http://www.heartsandhandsforhaiti.org) and if you click through you'll see that the middle column (main content section) doesn't reach down to the footer. Why's that? I'm stumped ... too tired to look at it anymore. Maybe I'm missing something.
Here's part of the css
Here's the template
Here's part of the css
Code: Select all
#extraleft {
float: left;
width: 110px;
margin: 0 0 100px 0;
padding: 5px;
font-size: 0.9em;
line-height: 1.5em;
}
#extraright {
float: right;
width: 110px;
padding: 5px;
font-size: 0.9em;
line-height: 1.5em;
}
#extras p {
margin: 0 0 1.5em 0;
}
#content_old {
margin: 0 100px 10px 160px;
border-left: 1px solid #f0f0f0;
border-right: 1px solid #f0f0f0;
padding: 0 2px;
line-height: 1.6em;
text-align: left;
background: #FFF;
}
#container {
width: 760px;
background: #fff;
margin: 0 auto;
}
#content {
width: 760px;
background: #D1E2F6;
}
#main {
margin: 0 125px 0px 125px;
border-left: 1px solid #f0f0f0;
border-right: 1px solid #f0f0f0;
line-height: 1.6em;
text-align: left;
background: #FFF;
}
#main h2 {
font-size: 24px;
color: #069;
margin: 5px 0 5px 0;
font-family: bangle;
}
#main img {
padding: 0px;
display:inline;
background: #cccccc;
border: 4px solid #f0f0f0;
}
Code: Select all
<!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" xml:lang="en" lang="en">
<head>
<!-- Type the title of your site here -->
<title>Hearts and Hands for Haiti - {title}</title>
{metadata}
{stylesheet}
{cms_selflink dir="start" rellink=1}
{cms_selflink dir="prev" rellink=1}
{cms_selflink dir="next" rellink=1}
<!--[if IE 6]>
<__script__ type="text/javascript" src="/modules/MenuManager/CSSMenu.js"></__script>
<![endif]-->
<__script__ src="uploads/javascript/sucker.js"></__script>
{global_content name='JavaScript for IE page width'}
</head>
</__body>
<div id="container">
<div>
<a href="index.php"><img src="uploads/images/logo1.jpg" width="760" height="80" alt="Home" /></a>
</div>
<img src="uploads/images/front.jpg" width="760" height="152" alt="Love, Hope, Faith" />
<!-- Start Navigation -->
<div id="menu_horiz">
<div class="menu-vert">
{cms_module module='menumanager' template='hhh01 : andreas01 : andreasmenu' number_of_levels='2'}
</div>
</div>
<!-- End Navigation -->
<div id="content">
<div id="extraleft">
{global_content name='leftside'}
</div>
<div id="main">
<h2>{title}</h2>
{content} </div>
<div id="extraright">
{global_content name='side'}
</div>
<!-- Start Footer -->
<div id="footer">
{global_content name='footer'}
<!-- End Footer -->
</div>
</div>
</div>
<__body>
</__html>