Question

我一直在努力解决这个问题几个小时我不知道css是否是一些如何不被应用或什么但它只发生在ie 7/8。即8版本几乎是正确但它仍然搞砸了可以有人帮小鸡出去吗？ http://tshirthideout.com/

这是导航菜单的代码

<nav class="main-navigation" role="navigation">
    <?php wp_nav_menu( array( 'theme_location' => 'primary', 'menu_class' => 'nav-menu' ) ); ?>
</nav><!-- #site-navigation -->

CSS

/* Navigation Menu */
.main-navigation {
    background-color: #fff;
    margin-top: 5px;
    text-align: center;

}
.main-navigation li {
    margin-top: 24px;
    margin-top: 1.714285714rem;
    font-size: 12px;
    font-size: 0.857142857rem;
    line-height: 1.42857143;

}
.main-navigation a {
    color: #5e5e5e;
}
.main-navigation a:hover {
    color: #21759b;
}
.main-navigation ul.nav-menu,
.main-navigation div.nav-menu > ul {
    display: none;
}
.main-navigation ul.nav-menu.toggled-on,
.menu-toggle {
    display: inline-block;
            *display: inline
            zoom: 1;
}

Answer 1

嗯，几件事。

尝试删除rem单位（为什么需要这些？）

行高似乎需要单位大小。

并尝试将<DOCTYPE>更新为<!DOCTYPE html>

对于早期的IE，您可能希望将<nav>代码更改为<div>

Answer 2

来自w3schools ::

Internet Explorer 9，Firefox，Opera支持该标记， Chrome和Safari。

IE＆lt; 9将忽略任何HTML5元素，但有

的javascript解决方案

Answer 3

可悲的是，IE7和IE8基本上不存在对HTML5的支持。实际情况是，如果你用HTML5 / CSS3编写，你会很难让它在IE7 / IE8中运行，而这就是它的方式。

要真正开始解决问题，请查看HTML5Shiv。它提供了一些样式，有助于防止旧的IE完全无法理解您的HTML5网页。

相关问题：Html5: header/footer/nav tags etc, what happens to these in IE7,8 and browsers than don't support html5?

尝试然后使用IE9 +的F12开发人员工具查看IE7中发生了什么 - 特别是检查控制台，在ie7模式下你会发现大量的jquery错误。

如果这不能完全起作用，至少它会移动过程以弄清楚还有什么问题。但不要担心 - 所有HTML5页面都存在这类问题。

IE 7/8中的导航菜单中断

3 个答案: