Пропорциональное изменение изображения.

[Микель]

Такая проблема...

Есть див фиксированной высоты в самом верху страницы, в нем есть изображение, прижатое к низу дива, высота изображения не указана, ширина, к примеру, 60% экрана.

При изменении разрешения экрана или просто ширины окна изображение, соответственно, тоже меняет свои пропорции. Необходимо, что если высота изображения начинает превышать высоту дива, то ВЕРХНЯЯ "лишняя" часть скрывается за верхней границей экрана. а не растягивает див по высоте. Уже мутил и с абсолютным позиционированием, и с iframe. Не хочет изображение прижиматься к низу дива.

<div style="text-align:center;vertical-align:bottom;height:200px;">
       <img src="/bitrix/templates/bs_index/img/flash.bmp" width="60%"/>
</div>
.....
Всякий контент

Edited March 6, 2010 by Микель

[Mavrun]

как вариант можно картинку задавать в качестве бэкграунда дива

а так это с абсолютным позиционированием играться надо

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

Edited March 6, 2010 by Mavrun

[Микель]

Решил проблему так

			<div style="position:relative;padding:0;margin:0;text-align:center;">
					<div style="position:relative;width:100%;height:200px;margin:0;padding:0;text-align:center;">
						 <img src="/bitrix/templates/bs_index/img/flash.jpg" width="70%" style="position:absolute;bottom:-68px;left:14%;margin:0;padding:0;" align="middle">
					</div>		
			</div>

Edited March 6, 2010 by Микель