Html 父div不随子div扩展，为什么不？

我的父div没有扩展到容纳孩子们的高度。我读到： 位置：绝对位置； 浮动：任何

都毁了这一切。问题是，保存绝对元素的div确实会扩展，但是保存这个位置的div:relative；，div没有扩展。我想添加一个用于查看的链接，但我的页面还不在服务器上（我直接从Firefox中的HTML查看）

澄清：是.banner_分区拒绝扩大

我的HTML

<header>
    <?php include 'header.php'; ?>
        <div class="menu_section">
            <label for="show-menu" class="show-menu">Show Menu</label>
            <input type="checkbox" id="show-menu" role="button"></input>
                <ul id="menu">
                  <li><a href="index.html">HEM</a>
                    <li><a href="hudvard.html">HUDVÅRD</a>
                    <li><a href="fotvard.html">FOTVÅRD</a>
                    <li><a href="massage.html">MASSAGE</a>
                    <li><a href="tejpning.html">TEJPNING</a>
                    <li><a href="varumarken.html">VÅRA VARUMÄRKEN</a>
                    <li><a href="omoss.html">OM OSS</a>
                    <li><a href="kontakt.html">KONTAKT</a>
                    <li><a href="kontakt.html">ONLINEBOKNING</a>
                    <li><a href="kontakt.html">TELEFONBOKNING</a>
                </ul> 
        </div>
    <div class="banner_section">
      <div class="rslides_container">
        <ul class="rslides">
          <li><img src="images/index_banner.jpg" /></li>
          <li><img src="images/fot_banner.jpg" /></li>
          <li><img src="images/massage_banner.jpg" /></li>
          <li><img src="images/tejpning_banner.jpg" /></li>
          <li><img src="images/hudvard_banner.jpg" /></li>
          <li><img src="images/omoss_banner.jpg" /></li>
        </ul>
      </div>
        <script>
          $(function() {
            $(".rslides").responsiveSlides({
              auto: true, speed: 1500, timeout: 2000, nav: true,
            });
          });
        </script>
    </div>
  </header>

---

要使父项依赖于子div，必须使父项

postion:relative

并将子对象的宽度和高度设置为任意值，父对象将根据需要进行调整

让我们看看演示：

好的，看看这个

我将clearfix添加到父横幅中，我有一把小提琴在这里工作：

这是clearfix css：

.clearfix:after { 
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */
.clear { overflow:hidden; clear:both; height:1px; margin:-1px 0px 0px 0px; font-size:1px; }
.clear-simple {clear:both; }

然后我将clearfix类添加到您的banner_部分，因此：

<div class="banner_section clearfix">

---

让我知道这是否适用于您（它也会在图像下方添加边距，但您在css中指定了边距）

首先你的html需要整理一下。您的菜单列表项均未关闭使用在线图像更新了fiddle现在有什么问题吗？不过你的fiddle现在可以工作了。单击侧面的红色按钮切换图像时，图像完全适合其父对象。它只是没有滚动到它。@Iharby噢。这让我很尴尬：很好，谢谢！小提琴确实在“工作”，但有问题的div、.banner_部分仍然是平坦的。我已经更新了问题，澄清了这就是问题中的div。这个演示确实很有效，但我不知道如何使用它来解决我的问题。谢谢你对Iharby的帮助。今天早些时候我设法解决了这个问题，你的一些建议真的很有帮助。我不能肯定地说我做了什么工作，我只知道在一次或另一次改变之间，它开始做我想做的事情。

<div class="banner_section clearfix">