How to add a footer to a page with left menu? - Page 2

Do you have a question? Post it now! No Registration Necessary.  Now with pictures!

Threaded View

Re: How to add a footer to a page with left menu?

Quoted text here. Click to load it

No. A person may use a custom style sheet because they are color
blind. Or perhaps they need large fonts due to vision problems.
It doesn't mean they wish to ignore what the author has suggested
as the ideal way to view their content; only that they have some
preferences/needs to meet as well.

Graceful degradation applies to using CSS just as much as using
JavaScript or straight HTML.

Rob - /
Web Stuff: /

Re: How to add a footer to a page with left menu?

Rob McAninch wrote:
Quoted text here. Click to load it

But putting fish in a table might be a valid (of course the fish might

For example a webpage about a fishing lake might want a table comparing
fish species available with an image of the fish, average weight, rules
about catching and so on.


Re: How to add a footer to a page with left menu?

 John Dalberg wrote:

 > I have a template webpage which consists of a table which has one row and
 > two columns. The left column will have a navigational menu and the right
 > cell has the page's main body.

 > I have a footer file which is a table which is basically one row and one
 > column.

 > I want to add the footer so that it shows up at the bottom of the main
 > page body flush with the bottom of the menu. White space should show
 > between main body and footer if main body doesn't have much text. The
 > problem is that if I add the footer after the body, it shows up just
 > beneath the main body because the column has align=top.
 > Any ideas on how to add the footer so that it's always at the bottom
 > flush with the left menu where bottom of menu aligns with bottom of
 > footer?

 > J.

No problem.
First, create a container division that will hold the three main divisions.
The menu division will be a fixed width, say 15%.
Use float:left; in the definition.
The main body division will come next.
Give it say a height of 80 - 90%.
The footer division will then take up the rest of the space and always be in
place where you want it.
Without the main container, the footer will drop below the menu column.

.bigbox { widtth; 100%; ....  .... }
.menu   { width: 15%; ... ... ...   float:left; }
.box1    { width; 85%; height: 85%; ... ... }
.footer  { width; 85%; ... ... }

<div class="bigbox">
    <div class="menu"> links </div>
    <div class="box1"> text text text </div>
    <div class="footer"> text </div>

Site Timeline