Thursday, May 15, 2008

なんでtrじゃいけないのはどうして

HTMLやらCSSやらを諸事情でいじってるんですが、テーブルの枠線ってやつが厄介なものです。

たとえばっていうかなんというか、水平線"だけ"のテーブルってあるじゃないですか。
そう、横方向の線だけで縦の線がないやつです。

感覚的に、tr に設定したいじゃないですか。
だってrowを隔てる線なんだから。
でも枠線はtdのものなんです。

横の線だけにしたかったら、もうtrの中の全tdにborderを指定しなきゃいけない。
ああ面倒くさい。
ひどい話ですよね。

まぁFirefoxはtrに指定しても線出してくれるんですが、

でもtd {...} とかを全サイト的に使うCSSに書くと、別にそうしたくないテーブルも下線は出ちゃうと。
ああ面倒くさい。

でも奥さん。
スタッフが一生懸命探しました。方法、見つかりました。(伸介調に
いや別にスタッフなんていないんですけど。

まぁ簡潔に書くと

table#hoge * td {
border-bottom: 1px solid black;
}

で、対象のテーブルのtableタグのid属性をhogeにするだけです。
名前#hogeの部分を変えれば何でもいいです。

これでそのテーブル"だけ"の全tdのborderが設定できます。
ほかのCSS定義との兼ね合いでうまく下線だけにならなかったら適当にいじってください。


要はhogeっていうidを持つテーブル以下のtdは全部これでいってね!って指定するわけです。
アスタリスクが間に挟まってるのはtbodyとかtheadとか、いつも省略しちゃう部分を省略したりしなかったりしたときにそれを飛び越えるためのものです。

これ見つけるというか思いつくというか、そうなるまでマジでtd全部指定したろうかと思ってましたが、助かりました。
ああ、すっきりした。

0 comments: