Hi,
I've never had this issue with <li> spacing before so I'm confused.
Basically I have a <ul> list to which I've applied a class that sets the
list items image icon (instead of the stand 'dot' icon) and in that class
I've also set margin = 0 and padding-left = 30 with all other padding = 0.
Then in the <li> also have both margin and padding = 0. And just to be sure
I've made all anchor tags within those <li>'s (all the LI's will have links
in them) also have a margin and padding of 0. Yet, in both FF and IE I'm
getting excessive vertical spacing between the list items. I can't see
what's causing it. The arrow_grey.gif mentioned below is only 11px high.
Here's the CSS code:
.grey_arrow_list{
list-style-image: url(Graphics/arrow_grey.gif);
margin:0px;
padding:0px;
padding-left:30px;
}
.grey_arrow_list li
{
margin:0px;
padding: 0px;
}
.grey_arrow_list li a{
font-weight: bold;
font-size: .75em;
padding: 0;
margin: 0;
}
And here's the HTML:
<ul class="grey_arrow_list">
<li><a href="#">Item 1</a></li>
<li><a href="#"> Item 2</a></li>
<li><a href="#"> Item 3</a></li>
</ul>
Any ideas?
Thanks.
--
No virus found in this outgoing message.
Checked by AVG Free Edition.
Version: 7.1.410 / Virus Database: 268.16.13/632 - Release Date: 16/01/2007
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
