나는 수평 드롭 다운 메뉴를 만들고 있었고 항목 아래에 각 드롭 다운 메뉴를 배치했을 때 멋지게 까다 롭다. 왼쪽 : 0; 위치에 필요합니까?
#nav { float:right; }
#nav li { display:inline;position:relative; }
#nav li ul { display:none; }
#nav li ul.current { position:absolute; display:block; z-index:9; left:0; }
#nav li ul.current li { display:block; }
그리고
<ul id="nav">
<li><a href="#">link</a>
<ul>
<li><a href="#">sub</a></li>
</ul>
</li>
<li><a href="#">link</a>
<ul>
<li><a href="#">sub</a></li>
</ul>
</li>
</ul>
의 메뉴 구조와 일부 JS는
$(document).click(function(e) {
if($(e.target).is("#nav li a")) {
$("#nav li ul.current").removeClass("current");
$(e.target).parent().find("ul").addClass("current");
} else {
$("#nav li ul.current").removeClass("current");
}
});
메뉴는이 코드와 함께 작동 작동하도록하지만 내 질문은 :
왜 왼쪽 : 0; #nav li ul.current에서 하위 메뉴를 올바르게 배치해야합니까?
왼쪽 없음 : 0; 크롬에서만 작동합니다. Opera, FF 및 IE8은 모두 #nav ul 시작 위치에 하위 메뉴를 렌더링합니다.
나는 절대적으로 배치 된 요소가 static이 아닌 가장 가까운 부모 요소로 갔다고 생각했습니다. #nav가 아닌 #nav li이 될 것입니다.