垂直菜單在Opera中出現horTontontal

所以我有一個垂直菜單，在firefox和chrome中正確顯示。但是，它在Opera中看起來是水平的。我真的認爲這只是代碼中的一個簡單調整，但我似乎無法縮小它的範圍！垂直菜單在Opera中出現horTontontal

#liststyle2 { 
    border-top-left-radius: 5px; 
    border-top-right-radius: 5px; 
    border-bottom-right-radius: 5px; 
    border-bottom-left-radius: 5px; 
    -webkit-border-top-left-radius: 5px; 
    -webkit-border-top-right-radius: 5px; 
    -webkit-border-bottom-right-radius: 5px; 
    -webkit-border-bottom-left-radius: 5px; 
    -moz-border-radius-topleft: 5px; 
    -moz-border-radius-topright: 5px; 
    -moz-border-radius-bottomright: 5px; 
    -moz-border-radius-bottomleft: 5px; 
    border: 1px solid #c7c7c7; 
    background-color: #ececec; 
    float: left; 
    text-decoration: none; 
    list-style-type: none; 
    list-style: none; 
    display: block; 
    margin: 20px 0 0 0; 
} 

#liststyle2 li { 
    text-decoration: none; 
    position: relative; 
} 

#liststyle2 li a { 
    padding: 17px 25px 15px 25px; 
    font-size: 15px; 
    float: left; 
    min-width: 77px; 
    text-decoration: none; 
    text-align: center; 
    display: block; 
    font-weight: bold; 
    color: #a3a3a3; 
    border-bottom: 1px solid #c7c7c7; 
    text-decoration: none; 
} 

#liststyle2 li a:hover{ 
    background-color: #e2e1e1; 
} 

#liststyle2 li:last-child a{ 
    border-bottom: none; 
}

來源

2013-02-18 Sean Marcus

這是更好，如果我有HTML代碼。

我認爲你應該刪除該選項：

#liststyle2 li a { 
    float: left; 
}

如果你有浮動這些li a到左。您必須設置#liststyle2 li a的寬度等於#liststyle2的寬度。

來源

2013-02-18 06:09:48 hungdoan

對於每個瀏覽器的引擎，都需要不同的轉換前綴。加入以下內容：

-o-border-top-left-radius: 5px; 
-o-border-top-right-radius: 5px; 
-o-border-bottom-right-radius: 5px; 
-o-border-bottom-left-radius: 5px;

在您的#liststyle2。

閱讀更多關於Opera的文檔。

來源

2013-02-18 06:04:59 hjpotter92

垂直菜單在Opera中出現horTontontal

回答

相關問題