Menuサブメニューを右にシフトしたJquery

Question

これは私のメニューです。ie6に問題があります。これはドロップダウンメニューで、サブメニューはie6の右側に移動してメニューを無用にしています...

ここにHTML：このjqueryの

#navigation{ 
    width: 905px; 
    height: 30px; 
    margin: 0px auto; 
    padding-left: 150px; 
} 
#navigation img{ float: left; vertical-align: top;} 
.single { 
    float: left; 
    font-family: Arial, Helvetica, sans-serif; 
    font-size: 14px; 
    color: #bfcee3; 
    text-decoration: none; 
    padding-left: 10px; padding-right: 10px; 
    margin-top: 20px; 
} 
.single:hover{color: #fff;} 
.menu_item{ 
    padding-left: 10px; padding-right: 10px; 
    margin-top: 20px; 
    float: left; 
    height: 35px; 
    text-indent: 8px; 
    overflow: hidden; 
    position: relative; 
    z-index: 10000000; 
    font-family: Arial, Helvetica, sans-serif; 
    font-size: 14px; 
    color: #bfcee3; 
    text-decoration: none; 
} 
.submenu{ 
    position: absolute; 
    top: 15px; 
} 
.submenu a{ 
    display: block; 
    width: 100px; 
    height: 15px; 
    font-family: Arial, Helvetica, sans-serif; 
    font-size: 15px; 
    color: #bfcee3; 
    text-decoration: none; 
} 
.submenu a:hover{ 
    /*background: #181818;*/ 
    color: #fff; 
} 
.menu_item:hover{ 
    overflow: visible; 
    /*background: #e0e0e0; 
    color: #181818;*/ 
} 

：：これはCSSで

 <div id="navigation"> 
     <a href="<?php echo base_url();?>" class="single">Home</a> 

     <div class="menu_item">Azienda 
      <div class="submenu"> 
       <a href="#">Link</a> 
       <a href="#">Link</a> 
       <a href="#">Link</a> 
      </div> 
     </div> 

     <div class="menu_item">Servizi 
      <div class="submenu"> 
       <a href="#">Link</a> 
       <a href="#">Link</a> 
       <a href="#">Link</a> 
      </div> 
     </div> 
        </div> 

$(".submenu").slideUp(100, function() { 
     $(".menu_item").css({overflow:'visible'}) 
    }); 
    $(".submenu").css({display:'none'}); 
    $(".menu_item").hover(function(){ 
     $(this).stop().animate({ 
      marginTop: "0px" 
     }, 300, function() { 
      $(".submenu", this).slideDown(300); 
     }); 
    }, function() { 
     $(".submenu", this).slideUp(300, function() { 
      $(this).parent().stop().animate({ 
       marginTop: "20px" 
      }, 300); 
     }); 
    } 
); 

Answer 1

、デフォルトはautoです。

left: 0; 

Answer 2

ちょうど変更すると、ie6のsubmenuクラスの余裕がなくなります。以下のような

何か：

if($.browser.msie && parseInt($.browser.version) == 6){ 
    $('.submenu').css('margin-left', '-50px'); 
} 

はそれをラインアップに役立つはずです。あなたは正確にそれを取得するには、ピクセル数で遊ぶ必要があります。働くだろうサブメニュー項目の左値を設定

here's a working example

Answer 3

IE6用の開発ツールバーをインストールすることもできます。私が何年にもわたり実行してきたことの1つは、他のdivの幅を定義することです。あなたはそれを正常に行う必要はありませんが、IE6はすべてを100％にし、レイアウトを破ります。

単なる考えです。