Question:
Html css getting footer to go to the bottom?
digitaldoodlebug
2011-03-17 11:19:58 UTC
I've looked at so many sticky footer tutorials i'm about to go insane. I know I had it working before, but the background had to be changed and now it's working in firefox but not IE. It's a 2 column layout with different colors. Because of the colors I can tell the main content isn't stretching down as far as it should, that's why the footer is too high, but I can't fix it.
http://summerfieldsoaps.com/

Css: * { margin: 0; padding: 0; }
html, body { height: 100%; background-color: #D7D7D7; }
#wrap { height: 100%; width:100%; }
body > #wrap { height: auto; min-height: 100%; text-align:center; }

#content { background:url('background.jpg'); background-repeat:no-repeat; background-position: top center;
width: 1000px; background-color: #ECE9E0; min-height: 100%; margin:0px auto; text-align:left; }
#main { position: static; width:100%; height:100%; min-height:850px; }
#left { position: relative; width: 250px; min-height:250px;
float:left;
top: 326px;
left: 25px; font-size: 12px;
}
#right { float:right; padding-top:325px; width: 70%; padding-right:10px; overflow:auto; }
#footer, .push {height: 3em; clear: both; }
#footer {position: relative;
z-index: 10;
line-height: 3em;
margin-top: -3em;
clear:both; width:100%;
font-size: 14px;
text-align:center
}


html simplified:


Categories







Three answers:
2011-03-17 22:57:22 UTC
In your HTML index file, browse at the bottom of the page until you reach the end of the form:

















lerner
2016-11-13 13:29:09 UTC
that's often perplexing to get a footer on the backside of a dynamic website: this implies you will desire to comprehend the top of all divisions above! considering those divisions substitute top with their contents, that's perplexing. even with the undeniable fact that, i take advantage of this trick (AJAX):
header code here /div
/div
code for considerable here (the dynamic one) p_foot(); -> the footer code! /div each and every time the biggest div is replaced, I basically upload p_foot() on the backside of the hot "considerable". ok, you will desire to upload the call to the footer each and every time you regulate the biggest, yet what's one line of code? Wfinn: no, i did no longer "write" any AJAX above. AJAX is what variations the CONTENTS of the preliminary divison. And this code works with ALL browsers, alongside with IE. SO, earlier telling that answerers do no longer comprehend what they're conversing approximately, think of! A synchronous JA vascript and X ml. I in all probability comprehend plenty greater approximately it than you do... And your code won't artwork on IE, nor Opera, nor Safari: you basically lost seventy 3% of cyber web customers.
2011-03-17 11:57:00 UTC
i looked at the source code in your website, and the footer use class="smfont" ?

but here



it's between the smfont or the #content :D



I'm too lazy right now to look deep down any code...

by the way, i guess you didn't plan your website very well :D since the algorithm overlapping..

it's hard to debug you know :D


This content was originally posted on Y! Answers, a Q&A website that shut down in 2021.
Loading...