html - 多行文字改变其他div的位置

Question

我正在尝试修复包含多行文本的 div 旁边的 div 位置。entry-bot当班级只有一行的文字时，一切看起来都很完美。我试过玩，overflow不幸的是text-wrap没有任何成功。

代码：http: //jsfiddle.net/UjAZD/1/

最终效果应该是这样的：http ://cl.ly/Qf3Z

Answer 1

您的卡片按基线对齐，这就是“弹出”带有两行描述的卡片的原因。让它们按顶部对齐：

.category-view {
    vertical-align: top;
}

卡片的底部宽度不包括填充，这就是为什么它比容器更宽。让开关盒模型：

.entry-bot {
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

现在让我们看看结果。