IE 및 Firefox의 CSS 이미지 크기 조정

Internet Explorer 및 Firefox에서 CSS 서식이 약간 이상하게 보입니다. 탐색 모음의 경우 배경 이미지가있는 열에 표시 할 이미지가 여러 개 있습니다. 이를 위해 배경 이미지를 페이지에 배치 한 다음 div 안에 각 이미지 링크를 저장하고 CSS를 사용하여 각 이미지의 서식을 지정했습니다. 사파리에서 잘 작동하지만 IE와 Firefox에서는 이미지가 배경 이미지에 맞게 필요한 크기로 확장되지 않습니다.IE 및 Firefox의 CSS 이미지 크기 조정

내 페이지에서 관련 CSS는 여기에 있습니다 :하지만 파이어 폭스와 IE에서,

<div class="nav_background_home"><img src="nav_background.png" width=100% /> 
<div class="nav_items"> 
    <img src="nav_items/set_design.png" class="nav_item" height=100% /> 
    <img src="nav_items/company_report.png" class="nav_item" height=100% style="height:4.1%;"/> 
    <img src="nav_items/prompt_pages.png" class="nav_item" height=100% /> 
    <img src="nav_items/characters.png" class="nav_item" height=100% /> 
    <img src="nav_items/costumes.png" height=100% class="nav_item" style="margin-bottom:2%;" /> 
    <img src="nav_items/video.png" height=100% class="nav_item" style="height:4.1%;" /> 

</div>

이 Safari에서 완벽하게 작동합니다 :

.nav_background_home{ 
width:17%; 
position:absolute; 
left:56%; 
top:31%; 
z-index:100;} 


.nav_background_home .nav_items{ 
position:absolute; 
top:8%; 
z-index:150;} 


img.nav_item{ 
margin-bottom:3.75%; 
height:4.4%; 
margin-left:7%;}

내가 다음 HTML의 모든 추가 이미지는 크기 조정을 거부합니다. 이미 HTML에서 "height = 100 %"를 제거하려고 시도했지만 아무 것도 변경하지 않습니다. 사이트가있는 경우 여기에 있습니다. http://gilmannews.com/rishi/sandbox.html.

감사합니다.

출처

2010-12-31 rbedi100

정확히 문제가 무엇입니까? 무엇에 딱 맞아야합니까? – DanMan

height = "100 %"및 width = "100 %"로 시작해야합니다.

또한, http://validator.w3.org/check

이 당신에게 어떤 브라우저가 잘 처리 할 수 있음을 거의 모든 종류의 문제를 보여줍니다 통해 그것을 실행하려고 노력하지만, 다른 사람들이하지 않습니다

출처

2010-12-31 10:19:14

IE 및 Firefox의 CSS 이미지 크기 조정

답변

관련 문제