Форум Сайтостроение Веб-строительство

Разные картинки в одинаковых блоках

PK
На сайте с 01.03.2010
Offline
93
Pahom-ka
824

Ситуация такова: делаю небольшой каталог и столкнулся с такой проблемой, что каждый продукт помещается в отдельный контейнер, ширина и высота которого - ну например 200px. Но картинки могут быть не просто не квадратные, но и больше/меньше, чем нужно.

Как сделать так, чтобы был контейнер фиксированной ширины и высоты, и в него помещалась любая по размерам картинка, не выходя за границы контейнера и соблюдая пропорциональность картинки.

Пример: картинка 120 на 200 px, должна поместиться в контейнер и не растянуться до 200px по ширине, вторая картинка 250 на 250 px, должна масштабироваться до 200 на 200.

ps js и php просьба не предлагать, интересно решение на html+css.

Спасибо за внимание и помощь.

Шлю смс-ки отсюда ( http://www.smspilot.ru/?r=3591 )
Olldman
На сайте с 21.04.2010
Offline
79
Olldman
#1

Например так: 

<div class="img">

<img src="1.jpg" alt="">

</div>

<div class="img">

<img src="2.jpg" alt="">

</div>

div.img{width:200px;height:200px;overflow:hidden;}

div.img img{max-width:200px;}
PK
На сайте с 01.03.2010
Offline
93
Pahom-ka
#2
Olldman:
Например так: 
<div class="img">

<img src="1.jpg" alt="">

</div>

<div class="img">

<img src="2.jpg" alt="">

</div>

div.img{width:200px;height:200px;overflow:hidden;}

div.img img{max-width:200px;}

Большое спасибо!

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий