忍者ブログ

Tiny Talesピンクのこつぶちいさな本棚ちいさなカンバス

    「枠線」の全文    
   最近の記事





日記
Tiny Tales
Might and Magic
UO
運営メモ
創作活動
<< >>
1 2
3 4 5 6 7 8 9
10 11 12 13 14 15 16
17 18 19 20 21 22 23
24 25 26 27 28 29 30

Tiny_Tales

枠線

2011/02/26(土)
cssで指定できるborderは、1つのタグにつき1つです。
二重線にはできますが、その2つの線それぞれの色や太さや間隔を細かく設定できるわけではありません。
何が言いたいかというと、この枠のような線にする場合は、<td></td>だけでは無理ということ。

今は背景画像でそれっぽくしてある本家ですが、やっぱりちょっと違います。
なのでちょっと手間ですが、<td><div></div></td>とでもして線をきちんと表現してあげようかなと。

思ったのですが。

ここみたいなテーブルの使い方ならいいんですけど、複数列に渡るテーブルだとどうやら無理のようです。
列Aが1行、列Bが2行以上となる場合、列Aのdivがtdの高さ一杯になってくれません。
divとtdの両方にheight:100%;を指定すれば一応なんとかなるんですが、そうすると今度は中央にあった文字列が上揃えになってしまい(泣)。

それだけならまあ許せなくもないんですが、borderをwidth、heightに含めるかどうかの解釈がブラウザによって異なるため、それをクリアするにはcssハックを用いるか、divではなくtableで対応するしかなくなってきます。

というわけでひとまず諦めたんですが、何かいい方法はないものでしょうか。。。


前のページ
 1156 
 1155 
 1151 
 1150 
 1149 
 1148 
 1147 
 1146 
 1145 
 1144 
 1143 
次のページ


忍者ブログ [PR]
PR