您能否看一下this demo并让我知道如何解决内部<ul>
的左缩进并摆脱子红色背景之前掉落的灰色区域?
<ul class="sidebar-navigation">
<li>List 1
<ul class="sidebar-inner-list">
<li> <a href="#">Link</a></li>
<li> <a href="#">Link</a> </li>
</ul>
</li>
<li>List 2
<ul class="sidebar-inner-list">
<li> <a href="#">Link 2</a></li>
<li> <a href="#">Link 2</a></li>
<li> <a href="#">Link 2</a></li>
</ul>
</li>
</ul>
body{color:#fff;}
ul{list-style-type:none;}
li{background-color:#2d2d2d;}
li:hover{ background-color:#ccc;}
.sidebar-inner-list>li{ background-color:red; margin-left:-40px;}
最佳答案
ul { padding:0 }
只需从列表中删除自动填充。我想这里的真正问题是,为什么不只使用
<div>
?它们没有自动填充,并且您似乎不需要实际的列表(list-style-type:无)。关于css - 嵌套的内部<ul>列表样式存在问题,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/23100823/