• ベストアンサー

CSSでfloatがうまくいきません。

CSSでfloatがうまくいきません。 .main{ width: 1000px; } .wrap{ width: 900px; height: 120px; margin-left: 50px; background-color: #ffffff; overflow:auto; } .head_l { width: 300px; height: 120px; float: left; } .head_r { width: 600px; height: 120px; float: left; } <div class="main"> <div class="wrap"> <div class="head_l">ロゴ画像</div> <div class="head_r">項目</div> </div> </div> mainの中にwrapという箱を作りhead_l(ロゴ画像)とhead_r(項目ボタン)という箱を横並びに表示させたいのですが、スクロールバーが出たりします。うまくいきません。どのようにしたらいいでしょうか?

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

  • ベストアンサー
  • hukazuo
  • ベストアンサー率32% (36/111)
回答No.2

画像サイズがロゴ画像がw300pxより大きいとか・・・。 あと項目画像がw600より大きいか。 上記のソースをそのままHTMLにしたら、 ちゃんとロゴ画像・項目が横並びになったので。。。 あとは項目</div>の後に、 <div style="clear:both;"></div> を入れるとか。。

その他の回答 (2)

  • k0021
  • ベストアンサー率26% (32/120)
回答No.3

忘れてしまったが。 900px=300px+600px ですが。 合計が1px少なくして見て下さい。 確かIE5.5かIE6初期バージョンの為に対応したつもりだが。 私の作成HPでは、%でも全て合計は、99%に修正していますが。

noname#83877
noname#83877
回答No.1

overflow:auto;を消してください

eccschool
質問者

補足

ありがとうございます。スクロールバーが消えたのですが、横並びになりません。ロゴの下に項目が縦並びに表示されます。 うーむ・・・。なぜでしょ??あー・・・わからない・・・。よろしくお願いします。

関連するQ&A

専門家に質問してみよう