浮动div不占用全宽 [英] Floated div not taking full width

问题描述

为什么浮动div不采取全宽？他们是否仍然阻止元素？

Why do floated divs don't take full width? Aren't they still block elements?

这里是一个示例 http ：//jsfiddle.net/GKjC8/

html

<div id="a">a</div>
<div id="b">b</div>

css

div {
    background-color:cyan;
}
#a {
    float:left;
}
#b {
    clear:left;
}

a div看起来像 inline ，因为它需要与其内容一样多的空间。

The a div looks like it's inline since it takes as much space as its content. Can someone explain?

推荐答案

您必须设置宽度：

#a {
   float: left;
   width: 100%;
}

项目（除非将
直接应用于具有隐含宽度的图像）。如果没有设置宽度，
的结果可能是不可预测的。 Floatutorial：Float Basics

小提琴

这篇关于浮动div不占用全宽的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！