-PR-
締切済み

テーブルのセルの高さ

  • 困ってます
  • 質問No.247348
  • 閲覧数227
  • ありがとう数3
  • 気になる数0
  • 回答数3
  • コメント数0

お礼率 100% (67/67)

テーブルのセルの高さを設定するには、HEIGHT=で設定すればいいと思うのですが、
たとえば、わかりやすい例でいうと、

<HTML>
<BODY>
<TABLE BORDER=1>
<TR><TD VALIGN="top">セルA</TD>
<TD VALIGN="top" ROWSPAN="2">
<TABLE BORDER=1>
<TR><TD>セルB-1</TD><TD>セルB-2</TD></TR>
<TR><TD>セルB-3</TD><TD>セルB-4</TD></TR>
<TR><TD>セルB-5</TD><TD>セルB-6</TD></TR>
<TR><TD>セルB-7</TD><TD>セルB-8</TD></TR>
<TR><TD>セルB-9</TD><TD>セルB-10</TD></TR>
<TR><TD>セルB-11</TD><TD>セルB-12</TD></TR>
<TR><TD>セルB-13</TD><TD>セルB-14</TD></TR>
</TABLE>
</TD></TR>
<TD VALIGN="top">セルC</TD></TR>
</TABLE>
</BODY>
</HTML>

というテーブルの場合、セルAとセルCの境界はセルBの高さの真中くらいに
なると思います。
それで、セルAとセルCの内容は固定なのですが、セルB内のテーブルはcgiからの
書き出しで可変長です。
実現したいことは、セルBの大きさにかかわらず、セルAの高さを固定したいのです。
セルCはセルBの高さと連動して可変するようにテーブルを組みたいのですが、
どのように指定すれば実現できるでしょうか?
セルAにHEIGHT指定してもなぜか、無視(?)されてしまいます・・・
よろしくお願いします。
通報する
  • 回答数3
  • 気になる
    質問をブックマークします。
    マイページでまとめて確認できます。

回答 (全3件)

  • 回答No.1
レベル9

ベストアンサー率 66% (40/60)

セルCも高さを指定すればいいと思いますよ。
↓のように。

<HTML>
<BODY>
<TABLE BORDER=1>
<TR><TD HEIGHT="24px" VALIGN="top">セルA</TD>
<TD VALIGN="top" ROWSPAN="2">
<TABLE BORDER=1>
<TR><TD>セルB-1</TD><TD>セルB-2</TD></TR>
<TR><TD>セルB-3</TD><TD>セルB-4</TD></TR>
<TR><TD>セルB-5</TD><TD>セルB-6</TD></TR>
<TR><TD>セルB-7</TD><TD>セルB-8</TD></TR>
<TR><TD>セルB-9</TD><TD>セルB-10</TD></TR>
<TR><TD>セルB-11</TD><TD>セルB-12</TD></TR>
<TR><TD>セルB-13</TD><TD>セルB-14</TD></TR>
</TABLE>
</TD></TR>
<TR><TD HEIGHT="150px" VALIGN="top">セルC</TD></TR>
</TABLE>
</BODY>
</HTML>
補足コメント
enzo_5150

お礼率 100% (67/67)

返答ありがとうございます。
はい、それも試してたんですが、セルBの高さが、セルA、セルCの合計の高さよりも
高くなった時にセルAのサイズが指定よりも高くなってしまい固定されないのです・・・。
セルCの高さを、(セルBの高さ-セルAの高さ)のこれ以上はないと思われる高さに
指定しておけばいいのでしょうが、その場合セルBが短いと余白ができてしまいますし・・・
どうしたらよいものでしょう・・・
投稿日時 - 2002-04-05 10:54:46
お礼コメント
enzo_5150

お礼率 100% (67/67)

回答ありがとうございました。
現在の内容をあまり変更したくないので、セルCをある程度高くしておいて
対応することにしました。参考になりました。
投稿日時 - 2002-04-09 20:15:45


  • 回答No.2
レベル12

ベストアンサー率 40% (201/496)

セルの高さや幅を固定するのによく使うのがスペーサーと呼ばれる透明の画像を入れる方法です。
1ピクセルX1ピクセルの透明 GIF画像を用意して、高さを指定したいセルの先頭で <img src="spc.gif" width=1 height=100> のように入れます。幅を指定する場合に使うこともあります。
ブラウザによって処理が異なり、どうしようもないときによく使う方法です。
お礼コメント
enzo_5150

お礼率 100% (67/67)

回答ありがとうございました。
現在の内容をあまり変更したくないので、セルCをある程度高くしておいて
対応することにしました。参考になりました。
投稿日時 - 2002-04-09 20:16:08
  • 回答No.3
レベル8

ベストアンサー率 35% (19/54)

急いでいるのでしたら、とりあえず下記のHTMLをお試しになられては?

★…‥‥━━━━━━━━━━━━━━━━━━‥‥…★

<HTML>
<BODY>
<TABLE BORDER=1>
<TR><TD VALIGN="top">
<TABLE BORDER=1>
<TR><TD HEIGHT="24px">セルA</TD></TR>
<TR><TD HEIGHT="100%">セルC</TD></TR>
</TABLE>
</TD>
<TD VALIGN="top">
<TABLE BORDER=1>
<TR><TD>セルB-1</TD><TD>セルB-2</TD></TR>
<TR><TD>セルB-3</TD><TD>セルB-4</TD></TR>
<TR><TD>セルB-5</TD><TD>セルB-6</TD></TR>
<TR><TD>セルB-7</TD><TD>セルB-8</TD></TR>
<TR><TD>セルB-9</TD><TD>セルB-10</TD></TR>
<TR><TD>セルB-11</TD><TD>セルB-12</TD></TR>
<TR><TD>セルB-13</TD><TD>セルB-14</TD></TR>
</TABLE>
</TD></TR>
</TABLE>
</BODY>
</HTML>

★…‥‥━━━━━━━━━━━━━━━━━━‥‥…★

どうしてもレイアトに完璧なものを求めるのでしたら、
スタイルシートでしょうね。
参考になれば幸いです。
お礼コメント
enzo_5150

お礼率 100% (67/67)

回答ありがとうございました。
現在の内容をあまり変更したくないので、セルCをある程度高くしておいて
対応することにしました。参考になりました。
投稿日時 - 2002-04-09 20:16:54
このQ&Aで解決しましたか?
AIエージェント「あい」

こんにちは。AIエージェントの「あい」です。
あなたの悩みに、OKWAVE 3,500万件のQ&Aを分析して最適な回答をご提案します。

関連するQ&A
-PR-
-PR-
こんな書き方もあるよ!この情報は知ってる?あなたの知識を教えて!
このQ&Aにはまだコメントがありません。
あなたの思ったこと、知っていることをここにコメントしてみましょう。

その他の関連するQ&A、テーマをキーワードで探す

キーワードでQ&A、テーマを検索する
-PR-
-PR-
-PR-

特集


専門家があなたの悩みに回答!

-PR-

ピックアップ

-PR-
ページ先頭へ