这是我的html中的代码:
<nav>
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="portfolio.html">Portfolio</a></li>
<li><a href="services.html">Services</a></li>
<li><a href="products.html">Products</a></li>
<li><a href="contactme.html">Contact Me</a></li>
</ul>
</nav>
Run Code Online (Sandbox Code Playgroud)
这是我的CSS:
nav {
-moz-column-count: 2;
-moz-column-gap: 1px;
-moz-column-rule: 1px solid #000;
-webkit-column-count: 2;
-webkit-column-gap: 1px;
-webkit-column-rule: 1px solid #000;
column-count: 2;
column-gap: 1px;
column-rule: 1px solid #000;
}
nav li {
border-bottom: 1px solid #000;
text-align:center;
}
Run Code Online (Sandbox Code Playgroud)
当我在IE 11中查看此内容并将窗口大小调整为平板电脑大小(介于481px和768px之间)时,导航变得非常糟糕,但在Firefox和Chrome中运行良好.您可以在以下位置查看该页面:
http://gc.palomar.edu/33605/33605jknowles5799/index.html
我到处看都在线,这应该适用于IE 11,因为IE 11支持多列,但事实并非如此.我已经尝试使用IE开发人员工具来添加/删除内容以尝试找出正在发生的事情,但我仍然没有看到它.
请帮忙!朱丽叶