Question

哦，那个尴尬的时刻，我觉得我不知道CSS是如何工作的......

我正在尝试在CSS中布局看板。一块板包含列，而这些列又包含任务。原理上，它很简单：

其中board是div，列是div，而task是带有段落的div。

我正在尝试将列设置为全高，这是我遇到问题的地方 - 由于某种原因，包含任务的列被一直推到页面底部（而没有任务的列不会）。

以下是CodePen链接，其中包含此行为的示例：http://codepen.io/anon/pen/jbOBrj。

（以及css代码，因为SO坚持指向代码扩展的链接必须附带代码）：

**self.isOccupied**

您能否建议如何纠正此问题？优选地，不使用浮子。

（如果你也可以解释为什么会这样，那会让我很开心。我对这种行为感到非常困惑。）

Answer 1

了解inline-blocks的对齐方式，然后将vertical-align:top;添加到.column课程中以解决问题