CSS：如何在高度受限的框中设置文本样式

Question

Have the following html that leverages Dust.js:

<div class="box">
    {text}
</div>

I want to style the box div such that, if the text, which is variable, goes longer than 100 pixels in height, it is cut off, so that the box works as a kind of mask for the text in question. Setting

.box{
   height: 100px;
}

does not do the trick here.

Answer 1

Try this:

.box{
   max-height: 100px;
    overflow:hidden;
}

Answer 2

您可以在CSS3中使用术语max-height ，也可以 white-space:nowrap;

Answer 3

you can use overflow:hidden

see jsfiddle for example: http://jsfiddle.net/

Answer 4

Try this

.box{
    max-height: 100px;
    text-overflow:ellipsis;
    white-space:nowrap;
}