Hey everyone,

I have a <ul> <li> list of multiple links with a custom image bullet. In Chrome, IE, and FireFox the bullet greatly differs in vertical positioning.

Here's a screenshot in Chrome. You can see how the positioning is off...


HTML Code:
HTML Code:
<ul class="list_links">       	
            <a href=""><li>Ultimate Frisbee</li></a>
            <a href=""><li>Northeastern Colleges</li></a>
            <a href=""><li>Division 1:  Swimming & Diving</li></a>
            <a href=""><li>National Honor Society</li></a>
            <a href=""><li>AP Computer Science</li></a>
            <a href=""><li>Business & Marketing Majors</li></a>
            <a href=""><li>No Car Policy?  Not for me..</li></a>
</ul>
CSS Code:
Code:
.list_links li {
	list-style: url(bullet.png);
	margin: 3px 0 3px 0;
}

Is there any way to fix the vertical positioning without adding clear padding to the bullet?

Thanks,
Brandon