[Problem Solved] Sticky footer

[nuodas159]

Why the footer isin’t in the page bottom? I used clear: both; but not working :/

HTML

DESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINEDESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINEDESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINEDESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINEDESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINEDESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINEDESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINEDESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINE

DESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINEDESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINEDESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINEDESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINEDESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINEDESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINEDESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINEDESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINEDESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINEDESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINEDESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINEDESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINEDESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINEDESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINEDESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINEDESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINEDESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINEDESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINEDESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINEDESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINEDESINE DESINE DESINE DESINE DESINE DESINE DESINE DESINE







KAIRE KAIRE KAIRE KAIRE KAIRE KAIRE KAIRE KAIRE KAIRE KAIREKAIRE KAIRE KAIRE KAIRE KAIRE KAIRE KAIRE KAIRE KAIRE KAIREKAIRE KAIRE KAIRE KAIRE KAIRE KAIRE KAIRE KAIRE KAIRE KAIREKAIRE KAIRE KAIRE KAIRE KAIRE KAIRE KAIRE KAIRE KAIRE KAIREKAIRE KAIRE KAIRE KAIRE KAIRE KAIRE KAIRE KAIRE KAIRE KAIREKAIRE KAIRE KAIRE KAIRE KAIRE KAIRE KAIRE KAIRE KAIRE KAIREKAIRE KAIRE KAIRE KAIRE KAIRE KAIRE KAIRE KAIRE KAIRE KAIRE

KAIRE KAIRE KAIRE KAIRE KAIRE KAIRE KAIRE KAIRE KAIRE KAIREKAIRE KAIRE KAIRE KAIRE KAIRE KAIRE KAIRE KAIRE KAIRE KAIREKAIRE KAIRE

CSS

body {

background: #0c0d0e;

color: #e2e2e2;

font-family: 'Myriad Pro';

text-align: center;

font-size: 100%;

height: 100%;

}



#one-page {

min-height: 100%;

position: relative;

margin-left: auto;

margin-right: auto;

text-align: left;

}



#header {

background: #fff;

margin: 0px auto;

width: 1100px;

height: 200px;

}



#desine {

width: 272px;

float: right;

}



#kaire {

width: 828px;

float: left;

}



#page-wrapper {

width: 1100px;

margin: 0 auto;

padding-bottom:208px;

}



#footer {

position: absolute;

width: 100%;

height: 181px;

text-align: center;

background: #fff;

bottom: 0;

left: 0;

}

[chrisburton]

@nuodas159 I changed the header footer backgrounds so you could see how it looks. Of course you can change that to whatever you’d like.

http://jsfiddle.net/WPqr5/

[nuodas159]

Am why you using reset? and the footer isin’t at the page bottom

[chrisburton]

@nuodas159 Using a reset reduces inconsistencies across browsers.

Thanks @kgscott284

[nuodas159]

http://www.part.lt/img/8980d580df7162787fa3dc70ade97b2230.bmp

The footer isin’t in the bottom of page.
I used bottom: 0; but nothing changed.

[chrisburton]

@nuodas159 Ah, you’re looking for a sticky footer. Perhaps someone else can help you with that. I’m a letterer and have limited knowledge in this area.

[nuodas159]

I used the sticky footer, but with these float: left or float: right; I mean

the footer isin’t at the bottom of page.

[nuodas159]

Sry, for double post this helped me :) https://css-tricks.com/snippets/css/sticky-footer/.
Problem solved.

[chrisburton]

Don’t worry about double posting. Glad you got it worked out.

[Author]

Posts