html - 表格溢出div时的圆角？

Question

我的结构类似于下面的代码。当表格对于内容容器来说太高时，它会隐藏溢出的内容。我的问题是可见表的底角是方形的，尽管它的容器 div 的下角是圆形的。有没有办法在表格底部和容器 div 底部之间不留空隙的情况下修整底部？

这是一个重现问题的演示 http://www.jsbin.com/ohejor/1/edit

<div class='container'>
<table>
    ....table populated by php pulling from mysql table
</table>
</div>

和 CSS

table{ overflow:auto;}
.container{ position:relative; height:75%;  border-radius:0px 0px 5px 5px;}

Answer 1

问题是您应该在容器而不是表上设置溢出-y：

table{}
.container{ position:relative; height:75%; border-radius:0px 0px 5px 5px; overflow-y: auto}

Answer 2

border-collapse: collapse添加到表选择器应该会有所帮助。

Answer 3

的角table是方形的，因为虽然你已经为 声明border-radius了div.container，但你还没有为table.

圆角table：

table { border: solid red 1px; border-radius: 0px 0px 5px 5px; }

div.container为了防止和 之间的间距table：

.container { padding: 0px;}