View Menu

Technical Support Forums

Free, outstanding support from WebAssist and your colleagues

Fixed Full Width Footer Problem

Thread began 10/25/2009 4:49 am by tim376588 | Last modified 10/26/2009 8:56 am by tim376588 | 1279 views | 5 replies


Cheers Tim,

It depends what you want the final effect to be (of course!). The template css sets the outerWrapper to have a minimum height of 100% - this is to force the footer div (which is outside of the outerwrapper) to the bottom of the screen - whatever resolution monitor is used to view it. It also has the unfortunate effect of forcing a vertical scroll bar - regardless of window size.This means that on a high-resolution screen that there is likely to be white space between the bottom of the content and the top of the footer (depending on how much content there is), and on a smaller resolution screen or on a non-maximised window there will be little or no white space.

Having a minus 30px top margin on the footer div does mean that there will be some text covered up when viewing the page on a small res screen or on a small window in IE, and because of the min-height property mentioned above, will go no real way to reducing the white space. My opinion is that that is not such a good idea. I would give the footer a top margin of 0px as it will make no great difference to the white space issue, but will be aesthetically slightly better (only my opinion) in that it will stop the footer running over the text. I would also reduce the min-height of the outerWrapper div to around 92% to allow for content + footer without forcing a vertical scrollbar even on a maximised window. That would be my recommendation, for what it's worth.

The white space issue could be solved by puting the footer div inside the outerWrapper div, but then it would not be full width of the screen and would look a bit odd in the context of the overall design. There are also modifications that could be made to the background image to create a pseudo footer - but only if the page content was not going to change.

Anyway, practically any design requirement can be realised with css, so if there's anything I or the people can help with, then post back here.

Build websites with a little help from your friends

Your friends over here at WebAssist! These Dreamweaver extensions will assist you in building unlimited, custom websites.

Build websites from already-built web applications

These out-of-the-box solutions provide you proven, tested applications that can be up and running now.  Build a store, a gallery, or a web-based email solution.

Want your website pre-built and hosted?

Close Windowclose

Rate your experience or provide feedback on this page

Account or customer service questions?
Please user our contact form.

Need technical support?
Please visit support to ask a question





Ease of use


security code refresh image

We do not respond to comments submitted from this page directly, but we do read and analyze any feedback and will use it to help make your experience better in the future.

Close Windowclose

We were unable to retrieve the attached file

Close Windowclose

Attach and remove files

add attachmentAdd attachment
Close Windowclose

Enter the URL you would like to link to in your post

Close Windowclose

This is how you use right click RTF editing

Enable right click RTF editing option allows you to add html markup into your tutorial such as images, bulleted lists, files and more...

-- click to close --

Uploading file...