导航条IE7愁楚

我的导航栏是一个悲剧性的混乱在IE7中显示时。我对这个遗留编码有点新感觉，并且从我读到的内容来看，伪状态，z索引和绝对位置都存在问题。导航条IE7愁楚

我已经试过各种事情，试图让它正常，但没有喜悦反应。

我也使用

<!--[if IE 7]> 
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE7.js"></script> 
<![endif]-->

尝试作为我的印象是，这将有助于下但问题依然存在。

任何帮助，非常感谢。

<aside> 
    <div class="module blue"> 
     <h2 class="wtf">Index<a href="../index.php">Select</a></h2> 
     <br/> 
     <h2 class="wtf">Admin Home<a href="../admin.php">Select</a></h2> 
    </div> 
</aside>

的CSS：

aside { display: block; } 

h2 { 
    font-size: 26px; 
    position: relative; 
} 

aside { 
    padding-top:10px; 
    width: 18%; 
    float: left; 
    min-width:250px; 
} 

.navMenu{ 
    display:block; 
    padding-top:10px; 
    width: 18%; 
    float: left; 
    min-width:250px; 
} 

.module { 
    background: #eee; 
    margin: 0 0 10px 0; 
} 
.module h2 { 
    background: #ccc; 
    line-height: 2; 
    padding: 0 0 0 10px; 
    font-size: 16px; 
    margin: 0 0 4px 0; 
    box-shadow: inset 0 25px 10px -10px rgba(255, 255, 255, 0.2); 
} 
.module h2 a { 
    float: right; 
    position: relative; 
    text-decoration: none; 
    color: #333; 
    padding: 0 10px; 
     border-left: 5px solid white; 
     -webkit-transition: padding 0.1s linear; 
     -moz-transition: padding 0.1s linear; 
     -ms-transition: padding 0.1s linear; 
     -o-transition: padding 0.1s linear; 
    } 

    .module h2 a:hover { 
     padding: 0 14px; 
    } 
    .module h2 a:active { 
     padding: 0 16px; 
    } 

    .module h2 a:before, 
    .module h2 a:after { 
     content: ""; 
    position: absolute; 
     top: 50%; 
     width: 0; 
     height: 0; 
    } 
    .module h2 a:before { 
     left: -12px; 
     border-top: 8px solid transparent; 
     border-bottom: 8px solid transparent; 
     border-right: 8px solid white; 
     margin-top: -8px; 
    } 

    .module.blue h2 a { 
     background: #a2d6eb; 
    } 
    .module.blue h2 a:hover { 
     background: #c5f0ff; 
    } 
    .module.blue h2 a:after { 
     left: -5px; 
     border-top: 6px solid transparent; 
     border-bottom: 6px solid transparent; 
     border-right: 6px solid #a2d6eb; 
     margin-top: -6px; 
    } 
    .module.blue h2 a:hover:after { 
     border-right-color: #c5f0ff; 
    }

感谢您的帮助！

来源

2013-08-30 null

你能确切地解释悲剧性乱七八糟的样子在IE7这不是很好吗？ – glenatron

恩，选择框已经丢失，并且位于h2名称后面。如果我从H2中移除相对于它的帮助，从A标记中删除浮动标记也有帮助，但我无法完成。 – null

重新IE7.js - 请注意，IE7.js旨在使工作的IE6 IE7一样。如果你想让IE7像IE8或IE9一样工作，你需要使用IE8.js或IE9.js，而不是IE7.js。 – Spudley

希望这可以帮助别人。

在我的例子，在H2标签的相对位置是造成严重破坏。

我通过开发模式曾在IE浏览器，直到我能得到我wasnted结果，弹出代码到一个新的CSS文件和使用的IF IE条件语句来调用样式表。

，因为它是在以后的版本，但它是一个该死的视线更好:)

感谢所有谁帮助

来源

2013-08-30 11:07:20 null

导航条IE7愁楚

回答

相关问题