四方が角丸で、最終行がdisplay="none"でも、最下部の角丸を維持したいということだと思います。
HTML
1<div id="box">
2 <table cellpadding="0" cellspacing="0">
3 <tr>
4 <th scope="col">タイトル1</th>
5 <th scope="col">タイトル2</th>
6 </tr>
7 <tr>
8 <td>内容</td>
9 <td>内容</td>
10 </tr>
11 <tr>
12 <td>内容</td>
13 <td>内容</td>
14 </tr>
15 <tr>
16 <td>内容</td>
17 <td>内容</td>
18 </tr>
19 <tr class="none">
20 <td>内容</td>
21 <td>内容</td>
22 </tr>
23 </table>
24</div>
CSS
1#box table {
2 border-collapse:separate;/* ここがミソ */
3 border:1px solid #000;
4 border-radius:5px;
5}
6#box th,#box td {
7 padding:10px;
8 font-size:14px;
9}
10#box th {
11 background-color:#efefef;
12 border-right:1px solid #ccc;
13}
14#box th:first-child {
15 border-radius:5px 0 0 0;
16}
17#box th:last-child {
18 border-radius:0 5px 0 0;
19 border-right:none;
20}
21#box td {
22 border-top:1px solid #ccc;
23 border-right:1px solid #ccc;
24}
25#box table tr td:last-child {
26 border-top:1px solid #ccc;
27 border-right:none;
28}
Firefox/Chrome/Operaで確認しましたが、いずれも実現できていると思います。
border-collapse:separate;はこちらを参考に、
なぜか、thにはradius指定が必要だけど、最終行のtdには必要ないようです。
補足:最終行にradius指定が…ってtdのbottomにborder入れてないから角丸に
なっていなくても、気づかないだけですね(笑)。
追記:逆に攻めてみました
CSS
1.none {
2 display:none;
3}
4#box table tr td:first-child {
5 border-radius:0 0 0 5px;
6}
7#box table tr td:last-child {
8 border-radius:0 0 5px 0;
9}
10#box table tr:not(.none):not:last-child td:first-child,
11#box table tr:not(.none):not:last-child td:last-child {
12 border-radius:0;
13}
最初から、左端のtd左下に角丸、右端のtd右下に角丸を指定。
notで、最終行と.none以外を角丸無しにする。
スタイル直書きはクラスにしておきました。