Hi List,
I have a strange but in IE6 and IE7 where I have an LI and inside that
there is a DIV. The LI has no padding and the DIV has no margin. The
DIV has a background image which is set to display at the bottom, and
because there is no margin and padding it should be sitting at the
bottom of the LI. But for some reason the LI extends about 20px
further down the page than it should so the background image doesn't
line up properly.
I don't understand where the extra height is coming from. The code is
below. If you want to see the site please send me a message off-list.
Any ideas?
<li>
<h2>Play the Face Off</h2>
<div>
<a href="#">
<img src="images/dummy/delorean.jpg" alt="" />
<span>Vote for me</span>
</a>
<div>
<em>vs</em>
</div>
<a href="#">
<img src="images/dummy/delorean.jpg" alt="" />
<span>Vote for me</span>
</a>
</div>
</li>
li { background: #000 url(../images/sidebar_bg.gif) repeat-y;
float:
left; margin-bottom: 5px; overflow: hidden; position: relative; width:
300px; }
li h2 { background: url(../images/rideoff.gif) no-repeat; height:
48px; margin-bottom: 15px; text-indent: -9999px; }
li div { background: url(../images/sidebar_bottom_bg.gif) left bottom
no-repeat; float: left; margin-right: -20px; padding: 0 19px 13px;
position: relative; }
li div div { background: none; float: none; margin-right: 0; padding:
0; position: static; }
li a { display: block; float: left; margin-right: 20px; width:
121px; }
li a img { border: 3px solid #fff; display: block; }
li a span { background: url(../images/voteforme.gif); display: block;
height: 29px; margin-top: 6px; text-indent: -9999px; width: 109px; }
li em { background: url(../images/vs.gif); display: block; height:
46px; left: 127px; position: absolute; text-indent: -9999px; top:
66px; width: 46px; z-index: 9999; }
li div>em { background: url(../images/vs.png); }
Thanks guys!
______________________________________________________________________
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/