如何在IE 7中水平放置此選項卡？

圖像是在IE7中垂直顯示的菜單列表項，但是我想要水平顯示它。我正在使用智能嚮導插件（framestyle.css），它可以在除IE7以外的所有其他瀏覽器中完美顯示。如何在IE 7中水平放置此選項卡？

framestyle.css：這是一個聰明的精靈插件的CSS。

.swMain ul.anchor { 
position:fixed; 
    z-index:1099; 
    display:inline; 
    float:left; 
    list-style: none; 
    padding: 0px; 
    margin: 5px 5px 0 0; 
} 

.swMain ul.anchor li{ 
    position: relative; 
    margin: 0; 
    padding: 0; 
    padding-top:3px; 
    padding-bottom: 3px; 
    clear:both; 
    display:inline; 
    float: none; 
} 

.swMain ul.anchor li a { 
    display:block; 
    position:relative; 
    float:left; 
    margin:0; 
    padding:3px; 
    height:35px; 
    width:146px; 
    text-decoration: none; 
    outline-style:none; 
}

IE7.css：這是菜單列表項的CSS的IE7瀏覽器

.swMain ul.anchor { 
display:inline; 
position:relative; 
list-style: none; 
padding: 0px 0px 0px 0px; 
margin: 10px 0px 0px 10px; 
zoom:1; 
float:left; 
clear:both; 
} 

.swMain ul.anchor li{ 
    margin: 0; 
    padding: -10px; 
    padding-top:0px; 
    padding-bottom: 0px; 
    clear:both; 
    display:inline; 
    float:left; 

} 
.swMain ul.anchor li a { 
    display:block; 
    position:relative; 
    float:left; 
    margin:0px 0px 0px 0px; 
    padding:3px 3px 3px 3px; 
    text-decoration: none; 
    outline-style:none; 
}

來源

2013-07-03 user2545497

您可以通過JSFiddle或JSbin請求創建示例嗎？ –

哇，仍然有瘋狂的人支持瀏覽器市場份額不到1％。 – Christoph

如果你想要的東西，以內嵌水平顯示，你不應該有clear: both;第一地方，因爲這將浮動項目放在一個新的線上。

您還應該在您的IE7樣式表中從.swMain ul.anchor li中刪除float: left;。

爲了清楚起見，下面的代碼就會把你的列表項行內水平：

li { 
display:inline; 
}

如果你想樣式列表項與一些填充和其他花哨的東西，你可以嘗試inline-block，但這會導致與IE7的幾個問題。你會找到一個解決方案here。

順便說一句，我被要求支持IE7的一些特定用途的項目，但總的來說，你可能完全放棄IE7的支持。

希望這會有所幫助。

來源

2013-11-23 18:16:31

如何在IE 7中水平放置此選項卡？

回答

相關問題