我尝试了一切！显示：内联将无法在IE上运行 [英] I tried everything! Display:inline won't work on IE

问题描述

我对HTML5很新，我遇到了困难。
这是我正在编码的网站。可以在Chrome，Firefox中使用和Safari。但在IE中有很多问题。但我会问最讨厌的一个：
我无法在IE浏览器中保留菜单项。
在你问之前，是的，我已经尝试了几十种不同的解决方案，这些解决方案写在互联网上但没有成功。

I'm very new to HTML5 and I got stuck. Here is the site I'm coding. It is OK in Chrome, Firefox and Safari. But in IE there are many problems. But I'll ask the most annoying one: I can't get menu items stay inline in IE. Before you ask, yes I've tried tens of different solutions written on the internet but none worked out.

这是我的CSS代码：

#wrap{
margin: auto;
position: absolute;
bottom:0px;
width: 915px;
left:0;
right:0;}

nav{ 
text-align:center;
margin-bottom:-4px;}

nav ul li {
display: inline-block;
zoom: 1;
*display: inline;

background-color: rgba(255, 255, 255, 0.5);
-webkit-border-top-left-radius: 10px;
-webkit-border-top-right-radius: 10px;
-webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.4); 
-moz-border-top-left-radius: 10px;
-moz-border-top-right-radius: 10px;
-moz-box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.4); 
border-top-left-radius: 10px;
border-top-right-radius: 10px;
box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.4); 
-webkit-transition-property: background-color;
-webkit-transition-duration: 0.5s;
-webkit-transition-timing-function: linear;
-moz-transition-property: background-color;
-moz-transition-duration: 0.5s;
-moz-transition-timing-function: linear;
transition-property: background-color;
transition-duration: 0.5s;
transition-timing-function: linear;}

nav ul li:hover {
background-color: rgba(255, 255, 255, 1);}

nav ul li a {
color:#8F8F8F; text-decoration:none; 
-webkit-transition-property: color;
-webkit-transition-duration: 0.5s;
-webkit-transition-timing-function: linear;
-moz-transition-property: color;
-moz-transition-duration: 0.5s;
-moz-transition-timing-function: linear;
transition-property: color;
transition-duration: 0.5s;
transition-timing-function: linear;}

nav ul li a:hover {color:#000;}

这是HMTL：

        <div id="wrap">
    <nav>
        <ul>
            <li style="padding: 8px 25px 10px 25px;"><a style="color:#000"><h2>BS Création</h2></a></li>
            <li style="padding: 8px 25px 10px 25px;"><a href="tasarimlar.htm"><h2>tasarımlar</h2></a></li>
            <li style="padding: 8px 25px 10px 25px;"><a href="custom.htm"><h2>kişiye özel</h2></a></li>
            <li style="padding: 8px 25px 10px 25px;"><a href="magaza.htm"><h2>mağaza</h2></a></li>
            <li style="padding: 8px 25px 10px 25px;"><a href="contact.htm"><h2>iletişim</h2></a></li>
            <li style="padding: 8px 10px 10px 10px;"><a href="http://www.facebook.com/bscreation"><img  src="img/facebook.png" width="15" height="15"></a>
        </ul>               
    </nav>
    </div>

任何人都可以帮助我吗？
谢谢！

Can anyone please help me? Thanks!

推荐答案

IE6-8无法识别HTML5元素，例如 nav 。您需要将它们注册到那些IE，以便您可以在它们上使用css选择器。请查看此SO问题或这篇文章关于如何实现这一点。

IE6-8 do not recognize HTML5 Elements such like nav. You need to "register" them to those IEs so you can use css selectors on them. Take a look at this SO question or this article on how to achieve that.

此外，您应该不惜一切代价避免使用内联样式。把它们放在你的外部css中，因为你已经有了它。

Also you should avoid inline styles at all costs. Put them in your external css since you already have one.

这篇关于我尝试了一切！显示：内联将无法在IE上运行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！