1 reply [Last post]
legendofgames
legendofgames's picture
Offline
newbie
Last seen: 8 years 51 weeks ago
Timezone: GMT-3
Joined: 2013-07-13
Posts: 1
Points: 2

http://css-tricks.com/snippets/css/sticky-footer/ Here is the tutorial I'm following. But my content is absolute positioned, which is causing a conflict, and the footer is not going down at the very bottom of the page. So how can I solve this?

 

And here is my css:

html, body {

width:100%;
min-height:100%;
background-image: url(../img/bg.png);
background-repeat: repeat;

}

#wrapper {
width: 1024px;
margin-right: auto;
margin-left: auto;
min-height: 100%;
margin-bottom: -200px;

}
.site-footer, #wrapper:after {
/* .push must be the same height as footer */
height: 200px;
}

.site-footer {
background-image: url(../img/foot.png);
background-repeat:no-repeat;
position:absolute;
width:100%;
bottom:0;

}

#banner {
min-height: 100%;
position: absolute;
top: 24px;

}

#navigation {
height: 60px;
position: absolute;
left: auto;
width: 100%;
top: 23px;
min-height:100%;
z-index:1;
border: none;
}

#categoria {
position: absolute;
width: 710px;
min-height: 100%;
z-index: 0;
left: -29px;
top:30px;
padding: 0px;
z-index:1;

}

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 1 year 17 weeks ago
Dallas
Timezone: GMT-6
Joined: 2004-06-25
Posts: 9776
Points: 3858

Why absolute positioning for

Why absolute positioning for basic layout? Of the various methods of laying out a page, that ranks at or next to the bottom of the list.

Let's see what you're doing, the html and css you're working with. Don't forget to wrap your source in code tags (use the code button). A link to the page is good. The tutorial doesn't tell us anything about why your page has problems.

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.