Question

我的代码如下

http://jsfiddle.net/gXN2u/219/

我正在尝试使用类item-list为每个项添加边框。但它没有显示。

我的实际滑块是垂直滑块。

我想要实现的目标：

！[在此处输入图片说明] [1]

请帮忙

Answer 1

清除浮动

 <div class="item-list clearfix">

在样式表中添加明确的修复样式

或为.item-list

添加浮点数和宽度

.item-list {
   border: 8px solid red;
   box-shadow: 0px 0px 0px 10px #888888;
   border-radius: 7px;
   -moz-border-radius: 7px;
   -webkit-border-radius: 7px;
   float: left;/*added*/
   width: 100%;/*added*/

}

Answer 2

或者，您可以使用overflow属性

.item-list {
    border-top: 1px solid red;
    overflow: hidden;
}
.item-list:first-child {
    border-top: 0;
}

http://jsfiddle.net/ewygux9t/

如何将边框添加到两个项目的旋转木马

2 个答案: