div 用了float 后，为什么跟在后面的内容不换行了？

这就是浮动的效果所在啊，你设置了左浮动，那你后面的一个容器肯定会水平显示的，只要宽度够，就肯定显示，要想下面一个换行，那就设置下面一个容器的clear:both清除浮动就好。

那是因为你设置总的宽度比较大，后面的内容水平排列有空间，所以你浮动后面的内容不会换行。你如果想让后面的内容另起一行，可以把div的宽度设置小一些，后面的内容没有空间，就会掉下去的！

不知道你理解没？建议你可以去w3school 去看看CSS浮动的知识，讲的很明了！

首先，要来明白float是做什么用的：

float 属性定义元素在哪个方向浮动。

如果浮动非替换元素，则要指定一个明确的宽度；否则，它们会尽可能地窄。

注意事项：假如在一行之上只有极少的空间可供浮动元素，那么这个元素会跳至下一行，这个过程会持续到某一行拥有足够的空间为止。

其值默认为none!

left
元素向左浮动。right
元素向右浮动。inherit
规定应该从父元素继承 float 属性的值。

使用示例：

div {
    float: left;
}

如果后面的元素不想浮动可以这样来清除，示例：

div {
   clear: both;
}

clear的值：可以为both都清楚，left清除左浮动，right清除右浮动,inherit清除继承浮动。

DIV是块元素，是自占一行的，你加上style="float:left"，它就浮动到左边，这个时候在它后面加内容是不会换行的，但如果你再加DIV，因为后面的DIV是块元素，所以就会换行

你这个曾没有设置宽度，宽度默认是100%的，当然会把内容挤下去的，设置个宽度就好了。