Отступ от img, откуда он?

Question

[Максим]

codepen.io/Geyan/pen/WxBQaK?editors=110 сама проблема под изображением , какой бы line-height бы не задать всё равно есть лишний отступ от изображения внизу , если ли мысли как этот отступ убрать Но без отрицательного margin

Answer 1

[archelon]

Если я правильно понял задачу, нужно выставить выcоту изображения кратную высоте строки тега p (с учетом маргинов).
например:

img {
height:100px;
width: auto;
}
p {
line-height: 20px;
}

Comments

[Максим]

вот это уже похоже на правду

Answer 2

[riot26]

При line-height: 18px; всё ок. Просто верхняя граница строки не вышла за пределы высоты изображения и переносить браузер не решается, потому что будет некрасивый межстрочный пробел.

Comments

[Максим]

да тоже самое там , я ine-height менял от 1 до 30 , и как было так и осталось

Answer 3

[Сергей]

Лишних отступов не вижу. Уточните в каком браузере есть?

Comments

[Максим]

у меня скрин выше , я про то и говорю что в одном разрешении экрана нету этого а в другом есть , я уже не первый год вёрсткой занимаюсь а на этом подвис

Answer 4

[Smeecy Smeecy]

Тут дело в том, что изображение уменьшается , а текст справа не изменяется.Либо делать изображение фиксированным с фиксированной высотой, для разных разрешений, либо адаптировать текст под каждое разрешение.

Answer 5

[Александр Алексеев]

line-height: 1
display: block

к картинке