Remove Extra Space at Bottom of HTML List Item

Question

Is there any way to remove the extra space displayed at the bottom of an HTML List Item tag without setting a fixed height on the list item? I.e. I would like the li

Answer 1

This is your code: http://jsfiddle.net/23LcK/

The gap is nothing to do with the lis. It's the space reserved for descenders in letters like g and p (because the imgs are inline elements).

You can remove it with any of these applied to li img:

• display: block: http://jsfiddle.net/23LcK/1/
• vertical-align with top or bottom: http://jsfiddle.net/23LcK/2/