即使窗口很小，如何使此页脚也停留在页面底部

Question

I am pretty much stuck in this html problem.

I have a page. i want its footer to stay at the bottom and have certian distance to element above it. here the Twitter + G+ div.

please see the css inside @media (min-width:481) .

i tried this:

html, body{
  height: 100%;
}
.fuss{
 position: absolute; 
 bottom: 0;
}

this works for big screens, but if i resize the window to small 15' screen laptop, footer is going over my Twitter and G+ elements. why is this?

this is the page: http://www.bibago.de/test.html footer works fine in big screens, but in small screens the footer goes over other elements and doesnot stay at bottom.

please help.

thanks.

Answer 1

You don't need to do anything special for the footer to appear at the bottom. Simply put it at the end of your page, and as HTML is rendered line by line, it will appear as the last thing (always at the bottom).

.fuss{
    margin-top: 50px;   
}

Answer 2

I usually do like this:

.fuss {
position: fixed;
bottom: 0;}