嵌套列表，显示块和边界半径

Question

我正在使用this fiddle中提到的嵌套列表。如果使用border-radius: 6px;，我认为可以在.csm li级别使用display: inline-block;。

有没有我误解的东西？

格特

Answer 1

如果您的目标是在每个顶级列表项上设置border-radius，则可以通过将.csm li后代选择器更改为子选择器来实现此目的：.csm > li：

http://jsfiddle.net/kfLaZ/2/

.csm > li {
    text-align: right;
    float: left;
    display: block;
    cursor: pointer;
    background-color: #D3EDFB;
    width: 95%;
    max-width: 27em;
    border-radius: 6px;
}

---

根据评论更新了小提琴：http://jsfiddle.net/kfLaZ/3/

.csm {
   list-style: none;
    overflow: auto;
    background-color: #D3EDFB;
    max-width: 27em;
    border-radius: 6px;
 }

.csm > li {
    text-align: right;
    float: left;
    display: block;
    cursor: pointer;
    width: 95%;
}