IE7 용으로 내 스타일 시트를 최적화하는 작업이 거의 끝났습니다 (처음 시도한 적이 있습니다).하지만 여전히 한 가지 문제가 있습니다. 드롭 다운 메뉴는 IE8 이상을 포함하여 다른 모든 브라우저에서 완벽하게 작동하지만 IE7에서는 잘못 정렬되었습니다. 어떤 이유로 하위 메뉴가 다음 메뉴 항목 아래에 정렬됩니다. 예를 들어;드롭 다운 메뉴가 IE7에서 잘못 정렬되었습니다.
<div id="main_nav">
<ul id="main_nav_list">
<li><a href="#">START</a>
<ul>
<li><a href="#">Contact</a></li>
<li><a href="#">Twee</a></li>
<li><a href="#">Derde</a></li>
<li><a href="#">Laatste</a></li>
</ul>
</li>
<li><a href="#">LEVEN</a></li>
<li><a href="#">MOBILITEIT</a></li>
<li><a href="#">VRIJE TIJD</a></li>
</ul>
</div>
그리고 여기 내 CSS (partitial)입니다 : 항목 1의 하위 메뉴 항목 2에 따라 정렬, 항목 2에서 하위 메뉴가 여기에
내 HTML (partitial)의 등의 항목 3에 따라 정렬#main_nav {
float:right;
height:40px;
margin-left:6px;
margin-top:90px;
position:absolute;
width:780px;
}
#main_nav_list li {
display:inline;
min-width:100px;
position:relative;
text-decoration:none;
}
#main_nav_list li a {
color:#222;
font-family:Absolut_Pro, Helvetica, sans-serif;
font-size:1.1em;
margin-left:5px;
margin-right:10px;
text-decoration:none;
}
#main_nav_list li a:hover {
border-bottom:2px solid #db002a;
color:#db002a;
}
#main_nav_list ul {
background-color:#FFF;
margin-top:20px;
padding-top:20px;
position:absolute;
width:180px;
}
#main_nav_list ul li {
background-image:url('images/list_bg.png');
background-repeat:no-repeat;
background-position:4% 50%;
border-bottom:1px dotted #666;
float:left;
font-size:0.7em;
padding-left:15px;
width:165px;
}
#main_nav_list ul a {
display:block;
font-family:Arial, Helvetica, sans-serif;
padding:5px 0;
}
#main_nav_list ul a:hover {
border:none;
text-decoration:none;
}
아이디어가 있으십니까? 사전에
감사
한 가지 위치를 점이다) 속성은 여백이 아니라 ... 항상 기본값이 0이라는 규칙은 아닙니다. –