お世話になります。
以下のソースで、table2の高さを100%にしたいです。
この書き方では、firefoxではうまく表示できるのですが、
IEではだめでした。どこがいけないのでしょうか??
----------------------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<style type="text/css">
<!--
html {height:100%;}
body {height:100%;}
.th100 {height:100%;}
-->
</style>
</head>
<body>
<table width="600" border="1" cellpadding="0" cellspacing="0" class="th100">
<tr>
<td width="300" rowspan="2">
長いテキスト
</td>
<td height="50"><table width="300" height="50" border="0" cellpadding="0" cellspacing="0" bgcolor="#000000">
<tr>
<td>table1</td>
</tr>
</table></td>
</tr>
<tr>
<td><table width="300" border="0" cellpadding="0" cellspacing="0" bgcolor="#999999" class="th100">
<tr>
<td>table2</td>
</tr>
</table></td>
</tr>
</table>
</body>
</html>
No.3ベストアンサー
- 回答日時:
こちらではうまく再現できないのですが、CSSの設定を次のようにしてみてください。
body {height:100%; margin: 0; padding: 0;}
.th100 {height:100%;}
これでも駄目なら。
table, tr, td {margin: 0; padding: 0;}
を追加してみる。
たびたびありがとうございます。
とても心苦しいのですが、上記CSSでもうまく動きませんでした…
table2の高さが、一画面の高さまでにしかならず、
テキストが一画面より長い場合、余白が出来てしまうようです。
ウインドウを小さくすると、table2の高さも小さくなります。
height100%がtdに対してではなく画面(ブラウザ)のサイズになってしまっているのでしょうか。
No.5
- 回答日時:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "
http://www.w3.org/TR/html4/loose.dtd">↑
これが不要です。
回答ありがとうございます。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
を削除したのですが、table1の上下に空白が出来てしまいます…
No.4
- 回答日時:
テーブルのセルの高さを指定したい場合は、そのセルが属するtrタグの高さを変更する必要があります。
ですので、table2の高さを変更するだけでなく、そのテーブルが入っているセルのtrタグの高さも100%にしてみてください。
回答ありがとうございます。
すみません、trタグの高さを100%にしたのですが、変化がありませんでした。
table2の高さがウインドウに対して高さ100%になってしまいます。
table2の入っているセルに対して高さ100%にするにはどうしたらよいのでしょうか??
No.2
- 回答日時:
<td><table width="300" border="0" cellpadding="0" cellspacing="0" bgcolor="#999999" class="th100">
↓↓
<td class="th100"><table width="300" border="0" cellpadding="0" cellspacing="0" bgcolor="#999999" class="th100">
これでいかがでしょう。
当方IE6、Firefox1.5で確認してます。
この回答への補足
足りなかった情報をこちらで補足させていただきます。
環境はIE6、Firefox1.5です。
「長いテキスト」というのは60行くらい(一画面より長い)です。
回答ありがとうございます!
教えていただいた方法を試してみましたところ、
テキストが短い場合にはうまくいってくれるのですが
テキストが長くなると(一画面より長くなると?)
table1とtable2の上下に余白が出来てしまいます。
どうしてこのようなことになってしまうのでしょうか…
せっかく教えていただいたのに申し訳ないです。
No.1
- 回答日時:
<table width="300" border="0" cellpadding="0" cellspacing="0" bgcolor="#999999" height="100%">
こうでもだめなんですか?
あくまでcssにこだわりたいのかしら?
回答ありがとうございます!
教えていただいた方法を試してみたのですが、cssの場合と変わりませんでした。すみません。
ちなみにcssでなくても構いません。
過去の質問を見るとみなさんcssでやってらっしゃったので、そのようにしてみました。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
関連するカテゴリからQ&Aを探す
おすすめ情報
- ・漫画をレンタルでお得に読める!
- ・街中で見かけて「グッときた人」の思い出
- ・「一気に最後まで読んだ」本、教えて下さい!
- ・幼稚園時代「何組」でしたか?
- ・激凹みから立ち直る方法
- ・1つだけ過去を変えられるとしたら?
- ・【あるあるbot連動企画】あるあるbotに投稿したけど採用されなかったあるある募集
- ・【あるあるbot連動企画】フォロワー20万人のアカウントであなたのあるあるを披露してみませんか?
- ・映画のエンドロール観る派?観ない派?
- ・海外旅行から帰ってきたら、まず何を食べる?
- ・誕生日にもらった意外なもの
- ・天使と悪魔選手権
- ・ちょっと先の未来クイズ第2問
- ・【大喜利】【投稿~9/7】 ロボットの住む世界で流行ってる罰ゲームとは?
- ・推しミネラルウォーターはありますか?
- ・都道府県穴埋めゲーム
- ・この人頭いいなと思ったエピソード
- ・準・究極の選択
- ・ゆるやかでぃべーと タイムマシンを破壊すべきか。
- ・歩いた自慢大会
- ・許せない心理テスト
- ・字面がカッコいい英単語
- ・これ何て呼びますか Part2
- ・人生で一番思い出に残ってる靴
- ・ゆるやかでぃべーと すべての高校生はアルバイトをするべきだ。
- ・初めて自分の家と他人の家が違う、と意識した時
- ・単二電池
- ・チョコミントアイス
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
tableタグとformタグの組み合わせ
-
html でのテキスト結合について
-
リストの記号を括弧付きの文字...
-
レイヤーとセレクトボックスが...
-
td要素内のdiv要素をセンタリン...
-
vbscriptで時計を作りたい
-
Dreamweaver デザインビューの...
-
テーブルの一部分のセルだけに...
-
テキストの表示について
-
Tableタグ内のspan styleが適応...
-
<img>タグにCSSのclass設定可能?
-
trとtrの間
-
同じクラス名はつけないほうが...
-
テーブルで画像を並べるときに・・
-
XHTMLに関する質問 順序が逆に...
-
ゲームの集計表のHTMLを教えて...
-
文字コードをEUCからSHIFT-JIS...
-
リンクをクリック出来ない。
-
webbrowserに関する質問です
-
ブラウザによってテーブルのセ...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
tableタグとformタグの組み合わせ
-
html でのテキスト結合について
-
テーブルの一部分のセルだけに...
-
同じクラス名はつけないほうが...
-
Tableタグで作成した表の縮小
-
td要素内のdiv要素をセンタリン...
-
Tableタグ内のspan styleが適応...
-
XHTMLに関する質問 順序が逆に...
-
ブラウザによってテーブルのセ...
-
表とリスト(ulとtable)の違い...
-
vbscriptで時計を作りたい
-
formのinputなどの幅100%指定
-
TDタグ内での均等割付の仕方
-
cssで、テーブルのtdの中の文字...
-
センタリングしたページの印刷
-
Firefoxを使ってるのですがズー...
-
divで囲んだ文字が消える
-
Dreamweaver デザインビューの...
-
テーブルの枠線に色が付かない
-
HTMLのテーブルでそれぞれの大...
おすすめ情報