Joomla Templates Club 406,261 posts

[bee7le Friend bee7leJoin date: June 2006Posts: 6Downloads:0Uploads:0 Thanks: 3]

#138946

Hey Guys,

I would appreciate any help you could provide with forcing the footer to the bottom of the page. I’ve tried a few things in the css, but they all seem to mess up something else on the site.

Basically what happens is if there is isn’t enough content on the page to cause the footer to be down far on the page, then there’s a good bit of white space left below the footer background, more or less depending how much content is in body area above.

Thanks in advance for your help.

[jsliao Friend jsliaoJoin date: April 2008Posts: 817Downloads:0Uploads:12 Thanks: 25 Thanked: 236 times in 210 posts]

#295104

do you have a link to show this problem? its difficult to visualise the problem just from your description alone and even harder to debug

[bee7le Friend bee7leJoin date: June 2006Posts: 6Downloads:0Uploads:0 Thanks: 3]

#295108

no worries, I think I’ve got it fixed enough for me:

#ja-footerwrap {
position:absolute;
bottom:0;
clear: both;
width:100%;
background: url(../images/pat-1.gif) repeat-x top #333333;
padding: 15px 0;
border-top: 4px solid #D7025F;

adding the absolute, bottom 0, and 100% width seemed to take care of it.

and btw, thanks for the quick response.

[bee7le Friend bee7leJoin date: June 2006Posts: 6Downloads:0Uploads:0 Thanks: 3]

#296265

After about a week of not touching the site mentioned above, I went back to work on it some more and noticed that all I really did was screw up the footer–causing it to appear over the top of other areas of the page. So I just stay up all night trying to figure out what was wrong.

btw – you joomlart guys really need to implement a fix on ALL of your templates for this that are setup with the footer being forced down only by content. All the content in the world won’t help you if your dealing with huge screen resolutions. After staying up all night and reading through pretty much all of your forums, I discovered that this has been a problem for going on 3 years and you’re still designing your templates the same way. Anyways . . .

If you want to know how to fix this for real, go into the template.css file and replace each style (and ONLY the styles listed below) with the following styles:


/* COMMON STYLE
--------------------------------------------------------- */
html, body, form, fieldset {
margin: 0;
padding: 0;
height: 100%;
}

/* MAIN LAYOUT DIVS
--------------------------------------------------------- */
#ja-mainnav,
#ja-header,
#ja-topsl,
#ja-botsl,
#ja-container {
position: relative;
min-height: 100%;
width: 950px;
margin: 0 auto;
}
#ja-footer {
width: 950px;
margin: 0 auto;
}

.narrow #ja-mainnav,
.narrow #ja-header,
.narrow #ja-topsl,
.narrow #ja-botsl,
.narrow #ja-container,
.narrow #ja-footer {
width: 750px;
margin: 0 auto;
}

/* COLLAPSIBLE LAYOUT
--------------------------------------------------------- */
#ja-containerwrap,
#ja-containerwrap-fr,
#ja-containerwrap-fl,
#ja-containerwrap-f {
height: 100%;
padding: 30px 0;
margin: 0;
clear: both;
}

/* FOOTER
--------------------------------------------------------- */
#ja-footerwrap {
position: relative;
margin-top: -7.5em;
clear: both;
background: url(../images/pat-1.gif) repeat-x top #333333;
padding: 15px 0;
border-top: 4px solid #D7025F;
}

I’m not saying I understand exactly why changing the styles as listed above works or that it makes sense, but just know it does. I do believe it could still stand some tweaking though. Get on it joomlart dudes!

If you care to inquire more about this check the following updated resource:
http://www.themaninblue.com/writing/perspective/2005/08/29/

Without which I would not have been able to fix this.

[bee7le Friend bee7leJoin date: June 2006Posts: 6Downloads:0Uploads:0 Thanks: 3]

#296270

The above fix does NOT work well when using the bottom moduels (user6 – user9). leaves a whole lot of blank white space.

[Author]

Posts