[CSS]使用float時不能顯示背景圖像

假設我的html and css是這樣...

html:
  1. <div id="box">
  2. <div id="left">
  3. </div>
  4. <div id="right">
  5. </div>
  6. </div>
複製代碼
css:
  1. #box {
  2.         width: 800px;
  3.         margin-right: auto;
  4.         margin-left: auto;
  5.         background-image: url(image/test.png);
  6.         height: auto;
  7. }

  8. #left {
  9.         width: 300px;
  10.         margin-left: 50px;
  11.         float: left;
  12. }

  13. #right {
  14.         width: 200px;
  15.         margin-right: 50px;
  16.         float: right;
  17. }
複製代碼
div box的背景圖像不能正常顯示...但如果我去除了#left and #right中的float...div box的背景圖就會正常顯示....請各位大大幫幫忙

why you assign height: auto; to #box?

TOP

原帖由 浩華 於 2009-9-3 00:35 發表
why you assign height: auto; to #box?

無聊set埋姐...

TOP

你張圖有幾大?

試下 background-image: top left url('image/test.png');
或者 background-image: top left url('image/test.png') repeat;

會唔會好d ?

如果唔想用 float, 可以向 div right  到用 margin-left: -550px;

TOP

原帖由 ccrackerjack 於 2009-9-3 08:52 發表
你張圖有幾大?

試下 background-image: top left url('image/test.png');
或者 background-image: top left url('image/test.png') repeat;

會唔會好d ?

如果唔想用 float, 可以向 div right  到用 margin-left: -550px;

圖係png...800 x 30
試以上果d...都唔得

TOP

always add <div style="clear:both;"></div>

right after float

TOP

原帖由 sandoeman 於 2009-9-3 14:19 發表
always add

right after float

加係<div id="left">&<div id="right">?

TOP

<div id="left"></div>
<div id="right"></div>

<div style="clear:both;"></div>

TOP