Поля/paddings в элементе li

Question

Как исправить этот странный эффект полей/paddings? (jsfiddle): i.imgur.com/64S8C.jpg Мне не нужны поля/paddings в элементе li.

Answer 1

Попробуйте использовать float недвижимость:

li img { 
    float: left; 
} 

или vertical-align:

li img { 
    vertical-align:middle; 
} 

Answer 2

Дополнительное пространство вокруг текста и изображения не создается из-за полей или отступов, но из-за того, как изображение выравнивается по вертикали относительно текста.

Присвоение vertical-align: middle к изображению, которое вы получите очень близко к тому, что вы хотите. Чтобы сделать его идеальным, отрегулируйте положение изображения с отрицательным верхним краем, пока он не расположится там, где вы хотите. Следующие (jsfiddle) хорошо подходят для меня:

li img { 
    vertical-align: middle; 
    margin-top: -3px; 
}