NeGiMeMo.net

ねぎさんのメモ帳。日常・メモ・ときどきWordPress。

border-radiusの意外な落とし穴

bell賞味期限切れコンテンツ

この記事は公開または最終更新から1231日くらい経過しています。
このメッセージが表示されている記事(特にプログラミング系)は情報が古くなっている可能性があるので注意して下さい。

CSS3で追加された、要素の角を丸くする、border-radiusですが、

これ、table要素には聞かないんですね。

知らなかった……

でもTableでも角丸にしたいときってあると思うんです。

そんなときはどうすればいいのか……

ぱっと思いついたのは、テーブルをDIVで囲い、そっちにボーダーと角丸をかける方法。

でもこれだと一番外側はDIVのボーダーとTableのボーダーで2重になってしまいますのでちょっと太くなってしまいます。[*1]

table要素のborderを消しても、結局td要素の線があるから余り意味が無いし、かと言ってtdのborderを消してしまうと、区切り線が全くなくなってしまいます。

それと、カドの部分がちょっとヘンな感じもしますね。

なかなか悩ましいです。。

TAGS