我有一堆里有超链接的。下面是一个演示http://codepen.io/anon/pen/aOxJyr
<div class="collapse navbar-collapse" id="categorycollapse">
<ul id="Category" class="row list-inline nav navbar-nav">
<li>
<a href="/products/Category/Cars">
Cars
</a>
</li>
<li>
<a href="/products/Category/Cars%20R">
Cars R
</a>
</li>
<li>
<a href="/products/Category/Bus">
Bus
</a>
</li>
<li>
<a href="/products/Category/Bus">
Bus
</a>
</li>
<li>
<a href="/products/Category/Tempo">
Tempo
</a>
</li>
<li>
<a href="/products/Category/Cycle">
Cycle
</a>
</li>
<li>
<a href="/products/Category/Jet">
Jet
</a>
</li>
</ul>
</div>对于这些列表项,我使用了以下CSS来对齐中心,对齐它们为。但是看起来其他一些css属性正在覆盖我的设置,而li的设置则是左对齐的。检查底部最左对齐的行。
#Category {
border:1px solid #C4C6C6;
margin: 0 60px 0 60px;
padding: 20px !important;
border-radius: 5px !important;
font-size: 12px !important;
text-align: center !important;
}
#Category > li {
font-family: 'Open Sans',sans-serif;
font-size: 14px;
font-weight: 400;
margin-top: 15px;
margin-left: 20px;
padding: 0 0 20px;
display: inline-block;
}
#Category li a, ol li a {
background-color: #07575B;
color: #FFFFFF;
transition: background .2s ease-in;
-o-transition: background .2s ease-in;
-moz-transition: background .2s ease-in;
-webkit-transition: background .2s ease-in;
padding: 10px 10px;
border-radius: 3px;
font-size: 14px !important;
display: inline !important;
}如何将列表居中对齐,使其覆盖所有css设置。对于中间对齐,我的意思是如果元素跨越两行,而第二行只有3个元素,那么这些元素必须是中心对齐而不是左对齐。
更新:收到了。问题在于我在类别上应用的属性navbar nav,该属性是对元素进行调整的。我把它拿走了。
发布于 2015-08-13 03:11:55
发布于 2015-08-13 03:27:28
运行OSX。刚刚检查了你的代码在Chrome,Firefox和Safari。每一个中心都是。您是否正在使用IE作为浏览器?
https://stackoverflow.com/questions/31978860
复制相似问题