* {
font-family: "微软雅黑";
}
.wrap {
width: 300px;
height: 400px;
border: solid 2px red;
}
.a {
width: 70px;
height: 200px;
background-color: orange;
float: left;
}
.b {
width: 150px;
height: 50px;
background-color: green;
float: left;
}
.b2 {
width: 70px;
height: 150px;
background-color: red;
float: left;
}
.c {
width: 100px;
height: 150px;
background-color: yellow;
float: left;
}
A B B2 C
问题：C元素的位置不是在A的左下方，而是在这个鬼地方，为什么会这样？
注意到，C的上方和B2好像的平齐的。C元素被挤下去后的垂直位置和B2有关系吗？
如果将B高度设置和A一样，C就从最左边排起了。
单单更改B2的高度，C垂直位置也会改变，但是保持C的上方和B2下方平齐。
隐约感觉C和B2的关系，但是看不出。
求大神解答或者相关链接供解读，谢谢！