Forum Moderators: not2easy

Message Too Old, No Replies

Bullets in list items not vertically aligned with text

Bullets in list items aren't vertically aligned with text.

         

loring

9:40 pm on May 7, 2009 (gmt 0)

10+ Year Member



In Opera 9, the bullets aren't lined up vertically with the text. The bullet is displayed slightly above the text (and to the left of course).

In all other browsers, the bullets line up fine. I don't see anything in the CSS that would affect this alignment.

Here's the CSS:
ul li {
margin-left: 25px;
padding-left: 0;
margin-top: 16px;
margin-bottom: 16px;
}

I've looked and haven't found any applicable bugs. Has anyone seen this behavior?

Thanks.

BillysProgrammer

3:19 am on May 8, 2009 (gmt 0)

10+ Year Member



A lot of the times this happens. Generally because of how the browsers settings are. Try adding a line-height to it, line-height automatically centers the text vertically.

Works well in all container elements. Never tried it on a span tag though.

loring

1:44 pm on May 8, 2009 (gmt 0)

10+ Year Member



BillysProgrammer, thanks for your response. I already tried setting the line-height, that was a good thought, but unfortunately it didn't work! Argh!

loring

2:25 pm on May 8, 2009 (gmt 0)

10+ Year Member



I figured out the problem. I had a span on the list item itself. When I removed the span, the list items lined up with the bullets.