• ベストアンサー
※ ChatGPTを利用し、要約された質問です(原文:XHTML+CSSによるデザインをしています。)

XHTML+CSSによるデザインで3段組レイアウトが崩れる問題の解決方法

このQ&Aのポイント
  • XHTML+CSSによるデザインで3段組レイアウトが崩れる問題の解決方法をご紹介します。
  • divボックスによる3段組レイアウトをする際に、2個目のボックスが表示されずメインボックスと右サイドバーが詰まってしまうという問題が発生しました。
  • この問題は、コーディングミスが原因であり、正しいコーディングを行うことで解決できます。

質問者が選んだベストアンサー

  • ベストアンサー
  • yyr446
  • ベストアンサー率65% (870/1330)
回答No.2

<div>の入れ子構造はあってますね。 <div class="sideAlphaWrap">の中の<div>にidの重複が3箇所あります。 id重複がレイアウト崩れの原因とは思えないけど、この中と後に、回り込み をクリアーしている<div class="clear"><hr /></div>が、ありますね。 CSS定義が無いので、解りませんが、このあたりをよく見直して見ては どうでしょうか? 文法チェッカーも役に立ちますが、 「Firefox + FireBug」 で実際に各<DIV>の位置やCSSの継承を視覚的に確認するととても便利です。 怪しいそうな<div>の箇所に背景色を付けて確認するとか

その他の回答 (1)

  • Safe_Mode
  • ベストアンサー率48% (1329/2725)
回答No.1

ここで質問するより、↓のようなサイトを利用してチェックするほうが早いと思いますよ。 http://htmllint.itc.keio.ac.jp/htmllint/htmllint.html 先ずは基本的なところとして、ブロック要素<div></div>の入れ子関係が崩れているとか、そのID属性が重複しているといった部分を手直しして、その後css側で幅指定がおかしくないかとか、回り込み指定がおかしくないかといったところをチェックしてみてはどうですか?