Eoin Magure wrote:
> 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.
>
>
You know what we're gonna say -- can we see a page? :-) It really is
impossible to tell what the problem is without one. Please post a URL to
the list.
In the meantime, you can do more debugging yourself by applying
background colors to all the pieces in order to determine if the space
is within or without the a or li elements.
Zoe
--
Zoe M. Gillenwater
Design Services Manager
UNC Highway Safety Research Center
http://www.hsrc.unc.edu
______________________________________________________________________
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/
