「Java+MySQL+Tomcatで始めるWebアプリケーション構築入門」（210ページ）で、「DivTest.html」をIEで開くと問題なく表示されるんですが、FireFOXで開くと「DIV.main」が縦に縮こまって「DIV.menu」と「DIV.contents」を囲んでくれません。何が原因でしょうか？何か回避できる方法はあるのでしょうか？
もしご存知でしたら教えていただけませんでしょうか？
もしご存知でしたら教えていただけませんでしょうか？
投稿：タタさん[wateryamy]/2011年 03月 31日 11時 00分
/更新：2011年 03月 31日 11時 00分
RE:FireFOXの誤表示（210ページ）
by 竹形 誠司[takegata]
竹形です、こんにちは。
ご質問の件、確かにFireFoxでは本書の通りになりませんね。
次のように<BR STYLE="clear:both;">を入れてみてください。
ご質問の件、確かにFireFoxでは本書の通りになりませんね。
次のように<BR STYLE="clear:both;">を入れてみてください。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<HTML>
<HEAD>
<TITLE>HTMLサンプル</TITLE>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=Windows-31J">
<LINK REL="stylesheet" TYPE="text/css" HREF="style2.css">
</HEAD>
<BODY>
<DIV class="header">
ヘッダー
</DIV>
<DIV class="main">
メイン<BR>
<DIV class="menu">
メニュー1<BR>
メニュー2<BR>
メニュー3<BR>
</DIV>
<DIV class="content">
本文1<BR>
本文2<BR>
本文3<BR>
本文4<BR>
本文5<BR>
</DIV>
<BR STYLE="clear:both;">
</DIV>
<DIV class="footer">
フッター
</DIV>
</BODY>
</HTML><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<HTML>
<HEAD>
<TITLE>HTMLサンプル</TITLE>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=Windows-31J">
<LINK REL="stylesheet" TYPE="text/css" HREF="style2.css">
</HEAD>
<BODY>
<DIV class="header">
ヘッダー
</DIV>
<DIV class="main">
メイン<BR>
<DIV class="menu">
メニュー1<BR>
メニュー2<BR>
メニュー3<BR>
</DIV>
<DIV class="content">
本文1<BR>
本文2<BR>
本文3<BR>
本文4<BR>
本文5<BR>
</DIV>
<BR STYLE="clear:both;">←★ココ★
</DIV>
<DIV class="footer">
フッター
</DIV>
</BODY>
</HTML>
CSSのclearはfloatの効果を終わらせる属性です。"http://www.w3.org/TR/html4/strict.dtd">
<HTML>
<HEAD>
<TITLE>HTMLサンプル</TITLE>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=Windows-31J">
<LINK REL="stylesheet" TYPE="text/css" HREF="style2.css">
</HEAD>
<BODY>
<DIV class="header">
ヘッダー
</DIV>
<DIV class="main">
メイン<BR>
<DIV class="menu">
メニュー1<BR>
メニュー2<BR>
メニュー3<BR>
</DIV>
<DIV class="content">
本文1<BR>
本文2<BR>
本文3<BR>
本文4<BR>
本文5<BR>
</DIV>
<BR STYLE="clear:both;">
</DIV>
<DIV class="footer">
フッター
</DIV>
</BODY>
</HTML><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<HTML>
<HEAD>
<TITLE>HTMLサンプル</TITLE>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=Windows-31J">
<LINK REL="stylesheet" TYPE="text/css" HREF="style2.css">
</HEAD>
<BODY>
<DIV class="header">
ヘッダー
</DIV>
<DIV class="main">
メイン<BR>
<DIV class="menu">
メニュー1<BR>
メニュー2<BR>
メニュー3<BR>
</DIV>
<DIV class="content">
本文1<BR>
本文2<BR>
本文3<BR>
本文4<BR>
本文5<BR>
</DIV>
<BR STYLE="clear:both;">←★ココ★
</DIV>
<DIV class="footer">
フッター
</DIV>
</BODY>
</HTML>
投稿：竹形 誠司[takegata]/2011年 03月 31日 17時 52分
/更新：2011年 03月 31日 17時 57分
<BR STYLE="clear:both;">
上記を書き込むだけで魔法のように改善しました。すごくびっくりしました。
本当にありがとうございました。
上記を書き込むだけで魔法のように改善しました。すごくびっくりしました。
本当にありがとうございました。
投稿：タタさん[wateryamy]/2011年 04月 04日 16時 21分
/更新：2011年 04月 04日 16時 22分
