...

View Full Version : Should be a simple fix for this layout issue. Help Dr. V!



cineweekly.com
08-31-2010, 07:40 AM
I changed things from my last post and now the problem appears to be much simpler but I still don't know what I'm overlooking. It's pretty self explanatory of what's wrong and what I'm going for. The right panel is shifted down.
www.cineweekly.com

Here is the code in question:



(Left Column)
#layoutLatest {
width: 150px;
position:absolute;
background-color: #FFFFFF;
}
.contentLatest {
font: 1em Arial, Helvetica, sans-serif;
padding:20px 0px 20px 10px;
}

(Middle Column)
#layoutMain {
width: 670px;
padding: 7px 0px 0px 0px;
background: #FFFFFF url(images/borderFilm.png) repeat-y center;
background-position:left;
font: 1em Arial, Helvetica, sans-serif;
line-height: 1.7em;
text-align: justify;
display: block;
margin-left:150px;
position:relative;
}
.contentMain {
margin: 0px 32px 0px 32px;
}

(Right Column that needs fixed)
#layoutSideBanner {
width: 150px;
background-color: #FFFFFF;
position:relative;
}
.contentSideBanner {
padding: 20px 0px 20px 0px;
}



Here is the html (Took out contents and replaced with "Content" for clarity):



<div id="layoutLatest">
<div class="contentLatest">
Content
</div></div>

<div id="layoutMain">
<div class="contentMain">
Content
</div></div>

<div id="layoutSideBanner"><div class="contentSideBanner">
Content
</div></div>

<div id="footer">
Content
</div>

cineweekly.com
08-31-2010, 08:41 PM
I made all three columns float:left; and it appears to work. Is this the best solution?



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum