overflow-hidden
以外の方法で角丸のテーブルを作る方法が知りたい人
![](https://sinpe-pgm.com/wp-content/uploads/2022/01/buranko_girl_sad-150x150.png)
角丸テーブルはoverflow-hiddenで実装してたけど、今回のテーブルはoverflow-hiddenできないんだよね。
テーブル内にドロップダウンあるから、overflowしても表示されないとマズイ。
![](https://sinpe-pgm.com/wp-content/uploads/2022/12/DSC02647-e1672070436919-150x150.jpg)
しんぺー
今回はこんな悩みに答えます。
tableはborder-radiusが効かないので、tableの親に<div>タグを置き、<div>タグにborder-radiusをかけ、overflow-hiddenする方法がありますが、今回はちゃんとtableを角丸にする方法です。
完成形のイメージ
See the Pen 角丸のテーブル by shimpei (@shimpei) on CodePen.
解説は後ほど。