关于css：为什么我的＆lt; div＆gt;离开他们的父母＆lt; div＆gt;？

Why are my <div>s leaving their parent <div>?

本问题已经有最佳答案，请猛点这里访问。

我很困惑。我希望2个div的内容根据子div的大小动态扩展其父div的高度；最大可扩展到600px——但是它们只是重叠，并且不会增加大小。有人愿意提供一些见解吗？很明显，我这里有些东西不见了。

以下是正在发生的事情：

http://puu.sh/2vexi.png

这是我的HTML：

1
2
3
4

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Impedit perspiciatis nihil explicabo quasi veritatis ipsum.

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quam, architecto quis quaerat excepturi maxime.

这是我的CSS：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30

.pictureBoxContainer {
padding: 12px;
clear:left;
clear:right;
width: 100%;
background-color: #eee;
border-radius: 4px;
max-height: 600px;
}

.pictureBox {
border: 1px solid #ee5;
width:100%;
}

.testp {
padding: 10px;
}

.pBoxLeftColumn {
display: block;
float: left;
max-width: 49.99%;
}

.pBoxRightColumn {
display: block;
float: right;
max-width: 49.99%;
}