Как убрать полоску под img?

Question

[DTX]

https://jsfiddle.net/DTX_/27s9du83/

Comments

[Дмитрий Кузнецов]

Какую полоску? У меня норм всё)

[Ivan Stroykin]

Дмитрий Кузнецов: я тоже никакой белой полосы не вижу :)
Испробовал аж 4 браузера

[DTX]

Не сохранилось, простите.
https://jsfiddle.net/DTX_/27s9du83/

Answer 1

[Дмитрий]

img это строчный элемент, и поэтому к нему применяется свойство vertical-align. В большинстве браузерах это свойство по умолчанию - baseline.

xiper.net/collect/html-and-css-tricks/content/img-...

1) display: block для .c-head img https://jsfiddle.net/5pb37kbk/
2) font-size: 0; или line-height: 0; для .c-head https://jsfiddle.net/soledar10/1jen5wef/
3) vertical-align: bottom; для .c-head img https://jsfiddle.net/soledar10/jozyjhqf/

Comments

[DTX]

Хм.. Если у боди указать font: 13px sans-serif; то всё будет ок. Не знаешь, почему так?

[trevoga_su]

DTX: потому что без засечек

[DTX]

trevoga_su: а поподробнее?)

[Сергей delphinpro]

trevoga_su: какие засечки?? ты гонишь )

[trevoga_su]

Сергей: «хвосты» букв )

Answer 2

[Артём]

.c-head img {
border: 0px solid;

}

Comments

[DTX]

Белую полоску в 1px, а не черную

[DTX]

DTX: полоска останется, просто её видно не будет. Вопрос, почему она возникает

[Артём]

DTX: Если ставишь 0, то её не будет, как это остается но не видно, у меня её нет https://jsfiddle.net/27s9du83/1/

[DTX]

KubrickHabr: i.imgur.com/loEj5QH.png

[Сергей delphinpro]

DTX: >> Вопрос, почему она возникает
Потому что img - это inline элемент. У inline элементов есть межстрочное расстояние.

[DTX]

Сергей: спс, но если указать font: 13px sans-serif; то всё будет ок

[Андрей]

Скорее всего не помогает font: 13px sans-serif; просто баг отрисовки в браузере.
Попробуй увеличить масштаб в браузере и в другом браузере открыть.

От того что ты меняешь размер шрифта у img отступ не измениться, если только размер не сделать 0.
Для понимания, можешь img считать большой буквой, с стандартными параметрами он обладает теми же свойствами, там вроде vertical-align только отличается.

[Андрей]

Хотя font: 13px sans-serif; может помочь если у тебя line-height: 13px;. Это опять же к строкам относиться.

[Иван Громкий]

я вот что то не совсем понял, причем тут междустрочные интервалы и подобное?? ведь там как и указано в данном ответе, border'ы проставлены!! или вы все таки не про те линии?

[DTX]

xcomzbk: про белую линию вопрос - та, что между бордерами