PDA

View Full Version : Align bullet



NeoDreamer
January 11th, 2007, 01:40 PM
I used this code to make my custom bullets


<UL STYLE="list-style-image: url(redball.gif)">
<LI>Bullet 1</LI>
<LI>Bullet 2</LI>
</UL>

But the bullets are not aligning to the middle of each list item. How do I do that?

duncanhall
January 11th, 2007, 01:50 PM
I find this is always a bit of a nightmare, especially trying to get it looking acceptable in both FF and IE.

Try a bit of trial and error with the 'line-height:' property and also have a look at the 'list-style-position:' property. Other than that, good luck!

YAOMK
March 25th, 2008, 02:02 AM
Well this solves it (a year too late):

1- specify "line-height:" to the size of the text.
2- add "padding-bottom:" to separate the items in the list

example:

ul{
line-height: 10px;
padding-top: 15px;
}

ul li{
padding-bottom: 15px;
list-style-image: url(images/bullet.gif);
}

Hope this helps someone out there!