如何强制我的跨度有一个确定的高度？

Question

我想在一行中显示“卡片”（例如每行4张卡片）。每张卡片都是div，其中包含标题（span）。我的主要问题是标题的高度会因显示整个标题所需的行数而改变。

因此，如果我有一个需要显示2行的标题，那么包含其自身的卡片将与只能在一行中显示标题的卡片进行转移。

在这种情况下，我会得到类似的东西：

         +-----+
+-----+  | ABC |  +-----+
| ABC |  | DEF |  | ABC |  
+-----+  +-----+  +-----+
|     |  |     |  |     |
|     |  +-----+  |     |
+-----+           +-----+ 

这是一个现场演示：http://plnkr.co/edit/eO9MwDyhFQg3BriMjikJ?p=preview

我该如何解决这个问题，即我希望所有卡片都具有相同的高度，当然完全对齐。

由于

Answer 1

只需在跨栏的类标题上添加vertical-align：

 .title {
   vertical-align:top;
 }

默认情况下为baseline，根据其他基线文本inline-block元素的长度，使得对齐更改。

_{您也可以将其添加到xxx课程并使用}

检查此演示http://plnkr.co/edit/X8vmBasqq3lZslMylSjI?p=preview

Answer 2

这是什么意思？ 我已经用左浮动替换了显示内联块 http://plnkr.co/edit/xvP2ElSyEV1oXHSkV4Fb?p=preview