IE9隨機CSS問題

Question

我目前debuggig我的網站在IE9和我來跨越視圖主要怪癖與在頂部網站的運行導航欄做，

當你看http://mensclothingroom.factoryagency.co.uk的nav很好，但是如果你再看看http://mensclothingroom.factoryagency.co.uk/category/socks這個nav部分堆棧，這是非常令人困惑的，因爲它們運行相同的CSS，也就是特定的樣式表。

CSS

.navigation { 
    position:absolute; 
    top:69px; 
    left:5px; 
    padding:0px 0px 0px 4px; 
    border-bottom:1px solid #ccc; 
} 

    .navigation .site_navigation { 
     padding:7px 0px 7px 0px; 
     clear:both; 
    } 

     .navigation .site_navigation ul { 
      height: 34px; 
      line-height: 34px; 

     } 

      .navigation .site_navigation li { 
       float: left; 
       height: 16px; 
       margin-right: 15px; 
       position: relative; 
      } 

       .navigation .site_navigation li > ul { 
        display:none; 
        width:165px; 
        position:absolute; 
        left:0px; 
        top:34px; 
        background:#fff; 
        border:1px solid #aaa; 
        z-index:999; 
        height:auto; 
        padding:2px 0px 
       } 

        .navigation .site_navigation li:hover > ul { 
         display:block; 
         box-shadow: 2px 2px 2px #999999; 
        } 

        .navigation .site_navigation li:hover > ul li > ul { 
         display:none; 
        } 

         .navigation .site_navigation li:hover > ul li, 
         .sidebar_navigation li { 
          line-height:11px; 
          clear:both; 
          display:block; 
          margin-bottom:2px; 
          width:140px; 
         } 

          .navigation .site_navigation li:hover > ul li { 
           height: auto !important; 
           line-height: normal; 
          } 

          .navigation .site_navigation li:hover > ul a, 
          .sidebar_navigation a { 
           font-size:10px; 
           padding:6px 0 6px 10px; 
           width:130px; 
           display:block; 
          } 

           .navigation .site_navigation li:hover > ul a { 
            width:155px; 
           } 

           .navigation .site_navigation li > ul a:hover, 
           .navigation .site_navigation li:hover > a, 
           .sidebar_navigation a:hover { 
            font-size:10px; 
            background:#999; 
            color:#fff; 
           } 

            .navigation .site_navigation li:hover > a { 
             font-size:12px; 
            } 


       .navigation .site_navigation li.sale { 
        float: right; 
        height: 25px; 
        line-height: 25px; 
        margin-right: 4px; 
       } 

        .navigation .site_navigation li.sale a { 
         background:#BE1E2D; 
         height:16px; 
         color:#fff; 
         padding:4px 18px; 
        } 

         .navigation .site_navigation li a.sale { 
          display:block; 
          height:25px; 
         } 

         .navigation .site_navigation li.current a.sale { 
          background:#9C1925; 
         } 

       .navigation .site_navigation li a, 
       .sidebar_navigation a { 
        color: #666666; 
        font-family: Georgia,Times,"Times New Roman",sans-serif; 
        font-size: 12px; 
        letter-spacing: 0.05em; 
        text-decoration: none; 
        text-transform: uppercase; 
       } 

        .navigation .site_navigation li a { 
         display: block; 
         padding: 0 10px; 
        } 

         .navigation .site_navigation li > ul a { 
          padding:0px 0px 0px 12px; 
         } 

         .navigation .site_navigation li a:hover, 
         .navigation .site_navigation li.current a { 
          background:#aaa; 
          color:#fff; 
         } 

IE CSS

.navigation .site_navigation { 
    padding:10px 0px 0px 0px; 
} 

.navigation .site_navigation li { 
    list-style:none outside none; 
    margin-right:15px; 
    float:left; 
    height:auto; 
} 

任何人都可以揭示該問題的任何輕？

Answer 1

在W3C HTML Validator看着它......

你first link無雜散HTML標籤。

您的second link has lots of stray/missing tags這可能會導致某些瀏覽器出現渲染問題。

• 124行，第9列：雜散結束標籤ul。

• 行302，第11列：沒有li元素在作用域中，但看到了li end標籤。

• 319行，第7列：看到的身體結束標籤，但有未封閉的元素。

• 第31行，第34列：未封閉的元素div。