Html 导航栏跨浏览器兼容性

我遇到了跨浏览器代码的问题

我在页面顶部添加了一个浮动导航栏，代码如下：

    <header id="page-header" class="content-info" role="contentinfo">
        <!-- Nav -->
        <nav id="nav">
            <ul>
                <li><a href="1.html">1</a></li>
                <li><span>2</span>
                    <ul>
                        <li><a href="2.1.html">2.1</a></li>
                        <li><a href="2.2.html">2.2</a></li>
                        <li><a href="2.3.html">2.3</a></li>
                        <li><a href="2.4.html">2.4</a></li>
                    </ul></li>
                <li><a href="3.html">3</a></li>
                <li><a href="4.html">4</a></li>
                <li><a href="5.html">5</a></li>
            </ul>
        </nav>
    </header>

它在除IE之外的所有浏览器上都能正常工作。导航菜单不会显示，这是因为参数“right:0；”。我曾尝试删除此参数，但在浏览器Chrome和Safari上，菜单被移到页面右侧的一半

我尝试过为所有浏览器创建样式，但IE如下所示：

<!--[if !IE]>< -->
<link rel="stylesheet" type="text/css" href="css/xbrowser.css" />
<!-- ><![endif]-->

我已确保从主css文件中删除参数“right:0；”。这不起作用，因为IE仍然识别出我告诉它忽略的css文件

有人能提出一个解决方案，让这项功能在所有浏览器（如Chrome、Safari、Opera、Mozilla和ie）上运行吗

---

提前感谢

您需要更改您的条件注释，所有浏览器当前仍可以阅读：

<!--[if ie]>
    Stuff. Only IE will read what's in here (up till IE 10)
<![end if]-->

---

请看这里的示例，您的评论周围的括号似乎是错误的。关于导航栏本身的问题，有什么建议吗？@MatthewLock我尝试过不同的括号，因为许多网站建议不同，但没有任何效果。请将它放在JSFIDLE中，这样我们就可以看到它全部运行。@yury，您是否尝试了一个明显的测试来确保条件注释确实有效？我修改了我的答案，加入了一个。如果您添加了它并在IE中看到标题，那么您知道问题可能在于CSS…您的

nav

绝对位于父容器内，这将与包装器的

位置：fixed

冲突为什么会冲突？导航位置设置为绝对，它只是覆盖。出于某种原因，当我在IE9中检查它时，它似乎是。IE9上的开发者控制台不是很友好，但当我关闭它时，导航栏又变得可见了。应用

position:absolute

确实会覆盖包装器继承的

position:fixed

，使其不必要。为什么这样定位包装器只是为了删除带有

position:absolute

的内容？您的评论让我朝着正确的方向思考，我已经为导航重新编写了一些代码，删除了更高的元素，并将导航与标题分离。现在可以了。谢谢

header#page-header {
right: 0;
}

<!--[if ie]>
    Stuff. Only IE will read what's in here (up till IE 10)
<![end if]-->

<!--[if ie]>
    <h1>Conditional comments working in IE!</h1>
<!--[end if]>