how to place div at bottom if it wont? Oo...

[rootKID]

Hey w3s again, im currently trying to make a foot div for a green webshop (for fun). Anyhow, im using this code:

#foot {  width:950px;  height:20px;  color:#FFF;  background-color:#90CA77;   bottom: 0px;}

what i am trying to, is go take the whole foot div down to the bottom, but it will not do it. Any ideas? Oo...it is working so far, but wont go down, and that is all i need it to. here is the rest of my CSS:

img {border: none;}a img {  border: none;}html, body {height: 100%; /*to fill it out with no white borders or weird remain space...*/margin: 0em;padding: 0em;background-color: #D0D6B8;}#wrapper {width: 950px;margin: 0 auto;background-color: #ECEEE1; top: 0px;bottom: 0px;height: 100%;}#logo_holder {  width: 950px; /*or 100%*/  height: 85px;  background-color:#595959;} #menu_holder {  width: 940px; /*Original: 950px, minus 10 for 5px at left and right (padding)...*/  height: 20px;  background-color:#90CA77;   padding-left: 5px;  padding-right: 5px;  border: none;}   /* unvisited link */  #menu_holder a:link {   color:#FFF;   text-decoration:none;  }  /* visited link */  #menu_holder a:visited {   color:#FFF;   text-decoration:none;  }   /* mouse over link */  #menu_holder a:hover {   color:#FFF;   text-decoration:none;  }  /* selected link (clicking on it with mouse)... */  #menu_holder a:active {   color:#FFF;   text-decoration:none;  }#foot {  width:950px;  height:20px;  color:#FFF;  background-color:#90CA77;   bottom: 0px;}

Edited June 17, 2013 by rootKID

[dsonesuk]

left: right: etc properties will NOT work unless position: (not static, i might add) is used. Sticky footer:Footer is placed below content container, with - top margin of the height of footer, the content container should be min-height: 100%; so it will fill the total height of browser window by defualt unless content extend beyond this, and a bottom padding is used to allow for the footer overlap when - top margin is used. requires no positioning usage at all, which is a really bad, bad, bad, bad, oh wait! did i mention it was a bad idea to use position.

[rootKID]

hmm, ok... so how would you fix again? hehe x)... and yes, was kind of easy not to oversee the word ''bad'' for position x)...

[dsonesuk]

#wrapper {width: 950px;margin: 0 auto;background-color: #ECEEE1; /*top: 0px;bottom: 0px; bad bad bad removed by dsonesuk*/ /* height: 100%;removed by dsonesuk*/min-height: 100%; /* added by dsonesuk*/padding-bottom: 20px; /*  added by dsonesuk, same height as foot which will prevent text going under foot */}#foot {  width:950px;  height:20px;  color:#FFF;  background-color:#90CA77; margin: 0 auto; /* added by dsonesuk*/margin-top: -20px /*  added by dsonesuk, same height as foot, will draw its bottom edge up to bottom edge of #wrapper which should be at bottom edge of screen by default until content inside #wrapper extends beyond screen height*//*bottom: 0px; bad bad bad removed by dsonesuk*/}

everything else, header, nav, must be iINSIDE the #wrapper container. with only the #foot on the outside.

[rootKID]

hmm, thanks, will test later! . And sorry for late reply, was to my danish oral exam today... god heaven it went ok, not the best, but okay . English Oral tomorrow, and DONE for august... yay x)...