Forum Moderators: not2easy
I have a footer with my logo and navigation that should appear at the bottom of my page. It does so in all the browsers I've tested in so far, except in IE 5.2 for the Mac. The footer seems to be positioned right above the top of the page in that browser.
Here's the CSS for the element:
#footer {
position: absolute;
left: 0px;
bottom: 0px;
width: 100%;
height: 50px;
background: #000 url(images/scissors.gif) 120px 5px no-repeat;
z-index: 3;
margin: 0px;
padding: 0px;
} If I change that bottom: 0px; to bottom: -20px; I can see the bottom of my footer peeking out from the top of the page. Anyone see my mistake, or know a workaround?
Thanks!
g.
PS. While we're at it, IE 5.2 seems to add to the total height of the page for each element it encounters with height: 100%;. What could I be doing to cause that?
but I found this on PIE re: the positioning to the bottom..
The IE/Mac bug needs a height applied to the relative container or it treats the container as 0px high when placing the lower boxes.
i.e. it's placing them above the box.. which is what you're describing?
is the element you're trying to place it at the bottom of positioned relatively?
Suzy
html {
margin:0px;
padding:0px;
}
body {
width: 100%;
height: 100%;
margin: 0px;
padding: 0px;
background-image: url(images/dk_pink.gif);
color: #000;
font-family: verdana, arial, san-serif;
font-size: 100%;
} Adding postion: relative; or position: absolute; doesn't seem to make a difference...
but... and this is from memory only so no guarantees..
try bottom: 1px; (or 10px or something..)
and/or try adding a few pixels of padding on the bottom of the body element does that make a difference?
Suzy
<added> the PIE [positioniseverything.net] page</added>