当表溢出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

问题是你应该在容器上设置overflow-y而不是表：

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

Answer 2

table的角是方形的，因为虽然您已为border-radius声明div.container，但您尚未对table这样做。

围绕table角落：

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

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

.container { padding: 0px;}

Answer 3

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