左：0;ポジションに必要？

Question

私は水平のドロップダウンメニューを作っていましたが、その項目の下に各ドロップダウンメニューを配置すると、気に入っていました。

#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; } 

そして、それは

$(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"); 
    } 
}); 

メニューは、このコードで動作しますが、私の質問は動作させるために

<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：

なぜ左です：0; #nav li ul.currentでサブメニューが正しく配置されている必要がありますか？

左記なし：0;それはクロムでのみ動作します。 Opera、FF、IE8はすべて#nav ulの開始位置にサブメニューを表示します。

私は、絶対配置された要素が、静的以外の位置を持つ最も近い親要素に移動したと考えました。 #navは#navではありません。

Answer 1

デフォルト値を使用すると、CSSのエンジンを書いている場合を除き、ブラウザがvarious rules that you probably shouldn't care aboutを使用して、独自の位置を割り出していることを意味します。バグや誤解がなくても、さまざまなブラウザでさまざまな結果が出るくらいのウィグルルームがあります。

位置オフセットは、最も近い非静的祖先（<li>）を基準にしていますが、オフセットがゼロであることを意味するものではありません。leftは、指定しないと計算された値です。負の値にすることができます。

基本的には：あなたは何を意味するのですか。 left:0を意味するので、それを言うべきです。

Answer 2

Becozあなたが言及した位置：絶対、デフォルトの設定、すなわち左：0pxを理解しているブラウザもありますが、不合理な結果を示す他のブラウザではデフォルト設定を理解できない場合があります。

私はこれが理由であるべきだと思う... left is autoとautoため