Forums: Front End:

I'm doing a project for IE6 and I'm having trouble with my bullet alignment. The ul bullets sit too high against the text, as though they were super-scripted. I've tried this, that, and the other thing but my CSS skillz are not up to whatever the heck is going on here.

Here's an example:


IE6 is on the left; all other browsers on the right. How do I kick these darn bullets down a bit and make them line up properly?

ul li {
	display: list-item;
	list-style-type:disc;
	vertical-align:text-top;
}

that is annoying but i'm not sure of the fix. i normally just live with it.

have you tried setting/adjusting your line height?

line-height:

line-height adjusts the height of the entire bullet + text, so it doesn't actually help.

Not sure about this 100% but try something like

ul li {
	display: list-item;
	list-style-type:disc;
	vertical-align:text-top;
}

<!--[if IE 6]>

ul {
	position: relative;
	top:-.5em}

li {
	vertical-align: top;
	position: relative; 
	top: .5em}
<![endif]-->

I'll give it a shot, Sir.

A list apart - Taming lists

This is my bible for any list related CSS issues. It should help you out.

I've never before had that problem with lists in IE.
I've also never used "vertical-align:text-top;"

Coincidence?