2013-05-15 3 views
0

Во-первых, я новичок в этом и много занимаюсь исследованиями, но не могу найти ответ.IE или Firefox не авторезистируют

Я установил контейнер div в верхней части моей страницы на 100% ширину и 20% высоты. Я хотел бы вставить изображение, которое будет автоматически изменяться по размеру экрана.

Я нашел код на этом сайте, который отлично работает на сафари и хром (также отлично изменяется на ipad и iphone), но в firefox (20) и IE (10) изображение немного изменяет размер, но не останется в родительском контейнер.

Может ли кто-нибудь помочь? Оригинальный код, который я использую это:

<html> 
<style type="text/css"> 
#myDiv 
{ 
height:auto; 
width:auto; 
} 
#myDiv img 
{ 
max-width:100%; 
max-height:100%; 
margin:auto; 
display:block; 
} 
</style> 


<div id="myDiv"> 
<img src="images/storm.jpg"> 
</div> 
</html> 

Любая помощь будет оценена

ответ

0
#myDiv img 
{ 
width:100%; 
height:100%; 
margin:auto; 
display:block; 
} 

Вы должны установить фактическую ширину/высоту (и, пожалуйста, помните, что я учусь!) изображение до 100%, а не максимальная ширина и максимальная высота.

+0

Спасибо за ваш ответ, к сожалению, он не работает, он просто растягивает изображение. Из того, что я вижу, изображение привязано к размеру тега div контейнера в Safari и Chrome, но это игнорируется в IE и Firefox, поэтому вы получаете изображение на 100% от его размера, игнорируя размер контейнера, поэтому он не изменит размер, если это будет сокращено или расширено. Любые другие идеи? –

Смежные вопросы