Hi guys,
I have a footer, which has a background image. Within the footer I have a
bunch of links (marked up as a list and floated left) and a copyright notice
(marked up as a paragraph floated right). In most browsers, this seems to
work just fine. In Opera 9.21 and Netscape 8.1.3, however, they are falling
out of the Footer div.
The easiest fix I can think of would be to apply a negative top margin to
the list and paragraph. But that would involve finding a way to apply that
fix only to Opera and Netscape. Is there a way to do that? Is this even the
best way around the problem? I've hunted on positioniseverything.net so no
avail, and Google isn't helping much either.
I've included the relevant code below, in case it helps anyone.
Cheers,
Seona.
#footer {
position: relative;
clear: both;
margin: 0 auto;
margin-top: -40px; /* drag footer from below the fold */
width: 958px;
height: 40px;
background: url(../images/telstra-footer-tile.gif) top left repeat-x;
}
#footer #footerlinks {
float: left;
padding-left: 10px;
width: 640px;
height: 30px;
background: url(../images/telstra-footer-start.gif) top left
no-repeat;
list-style: none;
}
#footer #footerlinks li {
float: left;
padding-right: 10px;
line-height: 30px;
}
#footer #copyright {
float: right;
margin: 0;
padding: 0 10px 0 0;
width: 295px;
height: 30px;
background: url(../images/telstra-footer-end.gif) top right
no-repeat;
color: #999999;
line-height: 30px;
}
<div id="footer">
<ul id="footerlinks">
<li><a href="">Footer Link One</a></li>
<li><a href="">Footer Link Two</a></li>
<li><a href="">Footer Link Three</a></li>
</ul>
<p id="copyright">Copyright Telstra eBusiness Services Pty Ltd 2007</p>
</div>
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
