Question

Style.css：

.widget{
    width: 100%;
    border-bottom-style: solid;
    height: auto;
}
.item{
    float: right;
    padding: 3px;
    width: 110px;
    height: 80px;
}

并且 index.html：

<div class="widget" id="reports">
                   <div class="item" id="km"></div>
                   <div class="item" id="km"></div>
                   <div class="item" id="km"></div>
                   <div class="item" id="km"></div>
</div>

但我的问题是结果“小部件”的高度为0。有什么问题，我希望“小部件”的高度继承自它的孩子。

Answer 1

在你的底部：

               <div class="item" id="km"></div>
               <div class="item" id="km"></div>
               <div class="item" id="km"></div>
               <div class="item" id="km"></div>

添加

               <div class="clear" style="clear: both;"></div>

结果如下：

<div class="widget" id="reports">
               <div class="item" id="km"></div>
               <div class="item" id="km"></div>
               <div class="item" id="km"></div>
               <div class="item" id="km"></div>
               <div class="clear" style="clear: both;"></div>
</div>

当然，您可以将清除类的样式添加到样式表中。您需要清除任何浮动div，因为您的父div将识别高度。

设置高度与子元素的高度

1 个答案: