View Full Version : UL & LI CSS Image alignment, is it possible?

10-11-2007, 10:29 AM
i'm creating a page which has a company logo as list bullets and was wondering if it's possible to re-align the images so that the text is vertically central to the image, can anyone help?

Page in question:

CSS for list style:
UL LI.x{
list-style-image: url(images/bullet.png);

the image is 20px high and in all of the browsers i've tested it in the text is aligned to the base of the image, is there a way to align it to the middle?

Thanks in advance for any help you may be able to give me.

10-11-2007, 10:37 AM
actually it is middle aligned but your line-heigth is too much decrease to 20px and it will be ok


10-11-2007, 10:49 AM
Changing the line height doesn't work in FF. This does:

add this to your css

position: relative;

Then enclose the text in your LI's in a span thus:

<li class="x"><span class="vertic-cent">company message board</span></li>

You may have to adjust the span to get your desired position, I thought -5px looked about right.

10-11-2007, 11:59 AM
Excellent. That worked like a charm in both FF and IE, Thanks very much for your help Donkey!