@mydarck

Верстка. Выход изображения за пределы фиксированного div. ?

Здравствуйте! Вопрос по верстке. Была необходимость любое по размеру изображение вписать в фиксированный div (width: 240px; height:160px;). Для реализации этой цели было использованы следующие html код:
<div class=”preview”>
  <img src=”путь/до/изображения.jpeg” />
</div>
<style>
.preview {
    background-color: #ffffff;
    border: 1px solid #999999;
    height: 160px;
    line-height: 160px;
    text-align: center;
    width: 240px;
}  
. preview img {
    max-height: 100%;
    max-width: 100%;
    vertical-align: middle;
}
</style>

Первая залитая картинка была 250х110, вписалась как нужно. А со второй возникли проблемы. Размеры картинки пропорционально уменьшались до необходимого замера, однако в верху появился отступ в 3px на который картинка выходит за нижнюю рамку ограничительного дива.
873fc863695f4a40abe0bc195c100aa0.gif
Если кто-то с подобным сталкивался, подскажите, пожалуйста, как быть.
  • Вопрос задан
  • 23311 просмотров
Решения вопроса 1
а тут же вертикально выравнивание, задай тогда
.preview { overflow: hidden; }
img { position: relfative; top: -3px; }
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы