- 締切済み
テーブルのセルの高さ
テーブルのセルの高さを設定するには、HEIGHT=で設定すればいいと思うのですが、 たとえば、わかりやすい例でいうと、 <HTML> <BODY> <TABLE BORDER=1> <TR><TD VALIGN="top">セルＡ</TD> <TD VALIGN="top" ROWSPAN="2"> <TABLE BORDER=1> <TR><TD>セルＢ－１</TD><TD>セルＢ－２</TD></TR> <TR><TD>セルＢ－３</TD><TD>セルＢ－４</TD></TR> <TR><TD>セルＢ－５</TD><TD>セルＢ－６</TD></TR> <TR><TD>セルＢ－７</TD><TD>セルＢ－８</TD></TR> <TR><TD>セルＢ－９</TD><TD>セルＢ－10</TD></TR> <TR><TD>セルＢ－11</TD><TD>セルＢ－12</TD></TR> <TR><TD>セルＢ－13</TD><TD>セルＢ－14</TD></TR> </TABLE> </TD></TR> <TD VALIGN="top">セルＣ</TD></TR> </TABLE> </BODY> </HTML> というテーブルの場合、セルＡとセルＣの境界はセルＢの高さの真中くらいに なると思います。 それで、セルＡとセルＣの内容は固定なのですが、セルＢ内のテーブルはcgiからの 書き出しで可変長です。 実現したいことは、セルＢの大きさにかかわらず、セルＡの高さを固定したいのです。 セルＣはセルＢの高さと連動して可変するようにテーブルを組みたいのですが、 どのように指定すれば実現できるでしょうか？ セルＡにHEIGHT指定してもなぜか、無視（？）されてしまいます・・・ よろしくお願いします。
- みんなの回答 （3）
- 専門家の回答
みんなの回答
- gellop
- ベストアンサー率35% (19/54)
急いでいるのでしたら、とりあえず下記のHTMLをお試しになられては？ ★…‥‥━━━━━━━━━━━━━━━━━━‥‥…★ <HTML> <BODY> <TABLE BORDER=1> <TR><TD VALIGN="top"> <TABLE BORDER=1> <TR><TD HEIGHT="24px">セルＡ</TD></TR> <TR><TD HEIGHT="100%">セルC</TD></TR> </TABLE> </TD> <TD VALIGN="top"> <TABLE BORDER=1> <TR><TD>セルＢ－１</TD><TD>セルＢ－２</TD></TR> <TR><TD>セルＢ－３</TD><TD>セルＢ－４</TD></TR> <TR><TD>セルＢ－５</TD><TD>セルＢ－６</TD></TR> <TR><TD>セルＢ－７</TD><TD>セルＢ－８</TD></TR> <TR><TD>セルＢ－９</TD><TD>セルＢ－10</TD></TR> <TR><TD>セルＢ－11</TD><TD>セルＢ－12</TD></TR> <TR><TD>セルＢ－13</TD><TD>セルＢ－14</TD></TR> </TABLE> </TD></TR> </TABLE> </BODY> </HTML> ★…‥‥━━━━━━━━━━━━━━━━━━‥‥…★ どうしてもレイアトに完璧なものを求めるのでしたら、 スタイルシートでしょうね。 参考になれば幸いです。
- yatokesa
- ベストアンサー率40% (201/496)
セルの高さや幅を固定するのによく使うのがスペーサーと呼ばれる透明の画像を入れる方法です。 １ピクセルＸ１ピクセルの透明 GIF画像を用意して、高さを指定したいセルの先頭で <img src="spc.gif" width=1 height=100> のように入れます。幅を指定する場合に使うこともあります。 ブラウザによって処理が異なり、どうしようもないときによく使う方法です。
お礼
回答ありがとうございました。 現在の内容をあまり変更したくないので、セルＣをある程度高くしておいて 対応することにしました。参考になりました。
- 387
- ベストアンサー率66% (40/60)
セルＣも高さを指定すればいいと思いますよ。 ↓のように。 <HTML> <BODY> <TABLE BORDER=1> <TR><TD HEIGHT="24px" VALIGN="top">セルＡ</TD> <TD VALIGN="top" ROWSPAN="2"> <TABLE BORDER=1> <TR><TD>セルＢ－１</TD><TD>セルＢ－２</TD></TR> <TR><TD>セルＢ－３</TD><TD>セルＢ－４</TD></TR> <TR><TD>セルＢ－５</TD><TD>セルＢ－６</TD></TR> <TR><TD>セルＢ－７</TD><TD>セルＢ－８</TD></TR> <TR><TD>セルＢ－９</TD><TD>セルＢ－10</TD></TR> <TR><TD>セルＢ－11</TD><TD>セルＢ－12</TD></TR> <TR><TD>セルＢ－13</TD><TD>セルＢ－14</TD></TR> </TABLE> </TD></TR> <TR><TD HEIGHT="150px" VALIGN="top">セルＣ</TD></TR> </TABLE> </BODY> </HTML>
お礼
回答ありがとうございました。 現在の内容をあまり変更したくないので、セルＣをある程度高くしておいて 対応することにしました。参考になりました。
補足
返答ありがとうございます。 はい、それも試してたんですが、セルＢの高さが、セルＡ、セルＣの合計の高さよりも 高くなった時にセルＡのサイズが指定よりも高くなってしまい固定されないのです・・・。 セルＣの高さを、（セルＢの高さ－セルＡの高さ）のこれ以上はないと思われる高さに 指定しておけばいいのでしょうが、その場合セルＢが短いと余白ができてしまいますし・・・ どうしたらよいものでしょう・・・
お礼
回答ありがとうございました。 現在の内容をあまり変更したくないので、セルＣをある程度高くしておいて 対応することにしました。参考になりました。