截断时可调整大小的框上的高度相同

Question

连续可以有4列，每列有不同的文本量，但每个列的末尾都有一个“读取更多”链接。在firefox浏览器中的mac上我可以更改文本的长度，因此每列的高度相同但是当在另一个浏览器中的PC上预览时，填充/字体大小略有不同，这使得框的高度不同。此外，如果您要放大浏览器窗口，也会更改高度。

我无法设置固定的高度，因为当您点击“阅读更多”链接时，它会打开并调整大小，以便随着文本的增长而增长。

这是图片示例：  http://forewardsapp.com/images/resize.png

Answer 1

我在我的一个网站上使用以下样式实现了这个：

margin: 0px 0px -100%;
padding: 0px 0px 100%;

Here is a Fiddle

Answer 2

您也可以使用flexbox

演示：http://jsfiddle.net/NMSQn/3/

.column-center
{
    display: flex;
}

.column-center .emotions
{
    flex: 1 0 auto;
}