2

我正在使用 html/css/javascript 编写卡片列表。
这是两个示例实现:http:

//jsfiddle.net/235Tp/

#wrapper {
    background: #EEE;
    width: 100%;
    height: 100%;
}

#cards-div {
    background: green;
    width: 100%;
    height: 70%;
    overflow-y:auto;
}

#cards-list {
    width: 100%;
    height: 100%;
}

#cards-list li {
    vertical-align: middle;
    text-align: center;
    height: 100%;
    width: 20%;
    float: left;
    background: #EEE;
    margin-left: -14%;
    border: 1px solid #000;
}

#cards-list li:first-child {
    margin-left: 0;
}

http://jsfiddle.net/scctk/

你可以看到一个有边界,而另一个没有。
带边框的有一个 y-asix 滚动条,我不想包括在内。
如何删除它?

4

2 回答 2

2

只需简单地更改overflow-y:autooverflow-y:hidden;如图所示:

#cards-div {
background: green;
width: 100%;
height: 70%;
overflow-y:hidden;

}

这是演示

于 2013-02-18T03:37:53.243 回答
1

使用box-sizing: border-box(and -moz-box-sizing) 将边框包含在盒子模型的宽度/高度计算中。

http://jsfiddle.net/235Tp/3/

于 2013-02-18T03:41:03.573 回答