Ограничение высоты div до двух строк текста внутри?

Ответ 1

div {
    height: 1em; // that one line, 2em for 2 lines, etc...
    line-height: 1em; // the height of one text line
    overflow: hidden;
}

Это отобразит div с высотой размера текущего размера шрифта, и любое переполнение будет обрезано. Пока длина линии и высота равны, будет одна строка текста. Доля высоты/высоты строки определяет количество отображаемых строк.

Ответ 2

Единица em настраивается на font-size, а пропорции line-height также основаны на этом. Таким образом, это то, что вы хотите использовать для "фиксации" высоты.

Вы хотите либо это:

div {
    height: 2.2em;
    line-height: 1.1;
    overflow: auto;
}

Пример скрипта.

Или, если вы хотите, чтобы это потенциально уменьшилось до 1 строки, используйте это:

div {
    max-height: 1.1em;
    line-height: 1.1;
    overflow: auto;
}

Пример скрипта.

Ответ 3

Возможное решение - добавить в код HTML это:

<div>
 &nbsp
</div>

Что вы хотите?

Другой способ сделать это - добавить следующие правила CSS:

div {
   padding: value;
}

Где значение должно иметь требуемый размер, например. 10px или 2em.

Я ожидаю ответа.

Cheers, Лео

Ответ 4

Я считаю, что вы ищете:

div.ClassName {
 padding: 1em;
}

Или, 2em для двух строк.