View Single Post
  #57 (permalink)  
Old 11-24-2008, 07:43 PM
James's Avatar
James James is offline
Super Moderator
 
Join Date: Dec 2007
Posts: 2,374
James is an elite member of WB with the maximum amount of reputation barsJames is an elite member of WB with the maximum amount of reputation barsJames is an elite member of WB with the maximum amount of reputation barsJames is an elite member of WB with the maximum amount of reputation barsJames is an elite member of WB with the maximum amount of reputation barsJames is an elite member of WB with the maximum amount of reputation barsJames is an elite member of WB with the maximum amount of reputation barsJames is an elite member of WB with the maximum amount of reputation barsJames is an elite member of WB with the maximum amount of reputation barsJames is an elite member of WB with the maximum amount of reputation barsJames is an elite member of WB with the maximum amount of reputation bars
Default Just a little more...

Alana,

There is one problem with the template that has arisen. Because the left and right columns float from the middle column (which is fine), if either the right or left column happens to be longer than the center column and there is anything intended to be below that, as in this case, alignment is thrown out of whack and some items overlap.

The solution is fairly simple. First, put anything intended to be at the bottom of the page inside a <div>. Then put an entry into the css to clear that div from anything on either (both) sides. In this case there are two items for the bottom of the page (actually three, but one is even below the "container" div), a tracking code. The two are the footer and a google ad that is wider than the content column.

Our code should be as follows:

For the html,

</div><!-- end of content -->

<div id="bottomarea">
<!--#include virtual="includes/adbanner2.html" -->
<!--#include virtual="includes/footer.html" -->
</div>

</div><!-- end of container -->


For the css,

#bottomarea {
clear: both;
}

With this addition, the bottomarea div will drop below the lowest area on either side column.
__________________
Good Success!

Douglas County Master Gardeners
"We don't always get what we want, but we always get what we expect."
Reply With Quote