子div中斷Parent Div repeat-y背景

Question

我目前有一個帶有repeat-y背景的div元素，子div會中斷當前背景。

我該如何阻止這種情況發生？

 <div id="content"> 
    <div id="container-top"></div> 
    <div id="container-body"> 
     <div id="container-right"> 
      <h1>LOGIN</h1> 
      <br /> 
      <h1>CLICK HERE</h1> 
     </div> 
     <div id="container-left"> 
      <h1 style="padding-left: 50px; font-weight: bold; color: #000000;">NEWS</h1> 
     </div> 
    </div> 
    <div id="container-bottom"></div> 
    </div> 

CSS： ＃內容{ 浮動：左; margin：5px auto; border：red 1px solid; }

#container-top { 
    width: 800px; 
    height: 23px; 
    background: url(http://cdn2.tribalwars.net/graphic/index/sprites.png) no-repeat 0 -39px; 
} 

#container-body { 
    padding: 15px; 
    overflow: visible; 
    background: url(http://cdn2.tribalwars.net/graphic/index/bg-content-line.jpg) repeat-y; 
} 

#container-right { 
    float: right; 
    width: 275px; 
} 

#container-left { 
    float: left; 
    width: 440px; 
} 

#container-bottom { 
    width: 800px; 
    height: 23px; 
    background: url(http://cdn2.tribalwars.net/graphic/index/sprites.png) no-repeat 0 -56px; 
    clear: both; 
} 

如果你去可以

Answer 1

你需要讓你的容器溢出隱藏，因爲你是浮動的孩子的。

結帳代碼http://jsfiddle.net/xUf87/