容器div忽略浮动元素的高度[重复]

[英]Container div ignores height of floated elements [duplicate]


This question already has an answer here:

这个问题在这里已有答案:

Ok, so this seems like a really silly problem but I can't get my container div to inherit the height of the floated elements inside of it. Since I need to center the container div, I can't use float to fix this problem. Here is my css:

好吧,所以这似乎是一个非常愚蠢的问题,但我无法让我的容器div继承其中浮动元素的高度。由于我需要集中容器div,我不能使用float来解决这个问题。这是我的css:

#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:

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>

Any ideas?

有任何想法吗?

1 个解决方案

#1


16  

You are looking for the so-called clearfix.

您正在寻找所谓的clearfix。


注意!

本站翻译的文章,版权归属于本站,未经许可禁止转摘,转摘请注明本文地址:http://www.itdaan.com/blog/2010/03/14/fa53f2cc217466bec1fb0ea1dbae569b.html



 
© 2014-2018 ITdaan.com 粤ICP备14056181号