- ベストアンサー
本文を縦幅いっぱいに表示させる方法とは？
- Tableタグを使用して、画面いっぱいに本文を表示させるHTMLを作成したい。
- 縦幅を画面いっぱいに表示させるには、Height属性を100%に設定する必要があるが、うまくいかない。
- また、テーブルの余白もなくしたいが、その方法について教えてほしい。
- hotjupiter
- お礼率71% (33/46)
- HTML
- 回答数2
- ありがとう数11
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 //EN"> というのを別なものに書き直せばいいわ。 たとえば <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> とかね。 理由は・・・めんどいので省略
その他の回答 (1)
- naokita
- ベストアンサー率57% (1008/1745)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>test</title> <meta http-equiv="Content-Style-Type" content="text/css" /> <style type="text/css"> body , html { height: 100%; margin:0; padding:0; } body{ border:3px double silver;} </style> </head> <body> <div style="position:relative; height: auto !important; height: 100%; min-height: 100%; "> <div style="height: 50px; border-bottom: 3px double silver;"> ヘッダ部 </div> <div> 本文 </div> <div style="height: 50px; width: 100%; position:absolute; left: 0; bottom: 0; border-top: 3px double silver;"> フッダ部 </div> </div> </body> </html>
お礼
ありがとうございます。 Bodyタグの前に、以下の行を挿入したら、余白がなくなりました。 <style type="text/css">body , html { height: 100%; margin:0; padding:0; }</style> スタイルシートとかDivタグとかは詳しくないですが…がんばってみます。
お礼
さっそくの回答、ありがとうございます。 ご指摘の方法で実現できました。 「テーブルの上下左右の余白のなくす方法」についても、回答をお待ちしたいので、ひきつづき回答受付のままとさせていただきます。