丸いボーダーテーブルを作ろうとしています。しかし、境界線にはほとんど問題がなく、テーブルの境界線は丸められていません..
grid1 { width:100%; border:1px solid #000}
ここに例があります http://jsfiddle.net/NHNFx/
<table class="grid1">
<tr>
<th>Salutation</th>
<td>MR</td>
</tr>
<tr>
<th>First Name</th>
<td>Greg</td>
</tr>
<tr>
<th>Last Name</th>
<td>Oden</td>
</tr>
</table>
table { border-collapse:collapse; border-spacing:0; border:0; }
.grid1 { width:100%; border:1px solid #000}
.grid1 tr th { width:115px; padding:20px; background:blue; border-bottom:1px solid #c8c8c8; border-right:1px solid #c8c8c8;}
.grid1 tr td { padding:20px; background:#f9f9f9; border-bottom:1px solid #c8c8c8; }
.grid1 tr:first-child th { border-radius:2em 0 0 0; }
.grid1 tr:last-child th { border-radius:0 0 0 2em ; }
.grid1 tr:first-child td:last-child { border-radius:0 2em 0 0; }
.grid1 tr:last-child td:last-child { border-radius:0 0 2em 0 ; }
助けてください...