Bullets displaying strangely in a UL

[TobyA]

Dear Web Gurus,

I've created a UL on the front page of this site:-

http://www.eggletonspecialistcars.co.uk/new/

In FF it looks OK but in IE the little ticks (tick.gif) are appearing too high relative to the text.

Any help would br greatly appreciated.

Cheers,
Toby

 

[BillyRayPreachersSon]

Does changing the line-height help? If so, you could use an underscore hack to give a different line height for IE, something like this:

line-height: 3em;
_line-height: 2em; /* or whatever works for IE for you */

Hope this helps,
Dan

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

 

[TobyA]

Hi Dan,

Thanks for your response.

I've tried your suggestion....

http://www.eggletonspecialistcars.co.uk/new/

Bringing the lines closer together does lessen the problem but it doesn't resolve it. Also, I want the lines to appear further apart for aesthetic reasons.

Any other ideas?

Cheers,
Toby

 

[Foamcow]

Change the line height and use a margin or padding to space the list elements out.

I would suggest adjusting properties within the li rather than the parent ul element.

<honk>*:O)</honk>
Foamcow Heavy Industries - Web site design in Cheltenham and Gloucester
Ham and Jam - British & Commonwealth forces mod for Half Life 2

 

[TobyA]

Hi Foamcow,

Thanks a lot for your response!

I have used line height to space out the lines already. However the tick image still sppears slightly too high relative to the text in IE6. Any idea how I can rectify this?

What difference does it make specifying the properties in the li element rather than the ul element?

Thanks again,
Toby

 

[TobyA]

I've sorted this now. I got the answer here:-

http://blog.codefront.net/archives/2004/02/20/list-style-image-alignment-quirk-in-iewin-and-opera/

I specified a background image in the <li> rather than using the list style....

http://www.eggletonspecialistcars.co.uk/new/

Thanks again for your helps anyway.