Question

我的一个容器有点问题。它并没有随着我的内容而扩展。这是代码：

<!--center section start-->
<div id="centerContent">
    <!--center left begin-->
    <div id="centerLeft">
    <h2>
    Special Disney Ticket Offer!
    </h2>
    <p class="specCont">
    <img class="specImg" src="images/universal-main-offer.jpg" alt="Special Universal Studios Ticket Offer!" />
    Super Value Disney 3 Day Touch of Magic Ticket! Just $219 for each ticket! Get 3 Days to visit the Disney Theme Parks (Magic Kingdom,        Epcot, Hollywood Studios, Animal Kingdom) PLUS a 4th day at Disney Quest, Blizzard Beach or Typhoon Lagoon! For an unbelievable value!        Call &amp; ask for the Resort offer<br />(restrictions apply).<br /> <strong>Call us: 1-800-544-7646</strong>
    </p>
    </div>
    <!--center left end-->
    <!--center right begin-->
    <div id="centerRight">
    <a href="http://tix.greatorlandodiscounts.com/index.php?catid=106">
    <img class="rightFrontImg" src="images/legoland-fl-front-ad.jpg" alt="Legoland Florida Discount Tickets" />
    </a>
    </div>
    <div class="clear"></div>
    <!--center right end-->
</div>
<!--center section end-->

CSS：

#centerContent {
    width: 980px;
    height: 100%;
    background-image:url(../images/main-special-bg-strip.png);
    background-repeat:repeat-y;
}

#centerLeft {
    width: 572px;
    height: 100%;
    float:left;
}

#centerRight {
    width: 408px;
    height: 100%;
    float:right;
}

我要做的是让centerContent div拉伸内部的两个div。我在centerContent上有一个背景条，它允许白色背景扩展100％。

我希望这有点意义，并提前感谢您提供任何帮助。

Answer 1

将overflow:auto;添加到#centerContent。

由于子div被浮动，因此父级崩溃并且表现得没有内容。添加overflow:auto;可恢复预期的行为。

容器不随内容扩展

1 个答案: