Для img max-height не работает?

Question

[Виталий Рыбченко]

Собственно вопрос выше, а пример тут.
Хотелось бы понять, почему не работает и как можно заставить? Кроме физического указания высоты в px, т.к. нужна именно резина.

Answer 1

[Александр Миранович]

Почему не работает, все работает https://jsfiddle.net/594e2fd5/1/ . Когда у родителя задана высота.

Comments

[Виталий Рыбченко]

В Вашем примере все прекрасно, но вот такой пример не работает
https://jsfiddle.net/594e2fd5/4/
В чем проблема, можете подсказать?

[Александр Миранович]

biovr: https://jsfiddle.net/594e2fd5/5/
тут из-за того, что вы прописываете display: table-cell

Answer 2

[wimanen]

Для того. что бы задать 80% от чего-то, нужно задать размеры тому родительскому элементу, от которого картинка будет иметь 80%. И картинки лучше "резинить" именно width, не используя height. То есть:

<div class="container" >
 <img src="" />
</div>

.container { width: 960px; }
.container img { width: 80%;}

Comments

[Виталий Рыбченко]

Да, но с шириной есть определенные проблемы - некоторые фото в вертикальной ориентации и уходят за границы экрана, а показывать нужно в максимально большом варианте