Container div yüzer elemanların yüksekliğini göz ardı eder

Question

Tamam, bu gerçekten çok saçma bir sorun gibi görünüyor, ancak konteyner div'um içindeki floating elementlerin yüksekliğini miras almam. Kapsayıcı div'i ortalamanız gerektiğinden, bu sorunu gidermek için float kullanamıyorum.

#container { 
margin: 0 auto; 
width: 1000px; 
border-left: 1px solid #f1f1f1; 
border-right: 1px solid #f1f1f1; 
border-bottom: 1px solid #f1f1f1; 
} 

#focus { 
padding-left: 23px; 
width: 977px; 
padding-top: 20px; 
padding-bottom: 23px; 
border-bottom: 1px solid #f1f1f1; 
float: left; 
} 

.rslider { 
float: left; 
width: 600px; 
margin-left: 15px; 
} 

.welcome { 
float: left; 
width: 300px; 
} 

Html:

<div id="container"> 
    <div id="logo_block"> 
    <a href="#"><img src="img/logo.jpg" alt="" /></a> 
    </div> 
    <div id="focus"> 
    <div class="welcome"> 
    <h1>All About This Page</h1> 
    <p>Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, liquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium.</p> 
    </div> 
    <div class="rslider"> 
    <img src="img/slider_image.jpg"> 
    </div> 
    </div> 
    </div> 

Herhangi bir fikir İşte benim css nedir?

Answer 1

clearfix adlı ürünü arıyorsunuz.