[CSS]テーブルの行に見出しセル(TH)が1つだけ存在する場合にだけ幅を設定する

CMSが普及して、HTMLを知らなくてもテーブル(表組み)を作れるようになった。

制作者からするとテーブルって結構厄介で、テーブルの見出しセルの幅をむやみに固定すると、見出しセルが複数横に並ぶ場合に、目も当てられない状況になったりする。

今回はその解決の糸口になればと思い、簡単なCSSを紹介する。

 

表の行の中に、見出しセル(<th>タグ)が1つだけ存在していれば、見出しの幅を固定する。

 

というもので、1行に複数の見出しセルがある場合には、固定をしない。

ソースコードと実際の動作を見て確認して見て欲しい。

HTML

CSS

Run Result

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です