Есть ли перенос слов или любой другой атрибут, который останавливает перенос текста? У меня высота, и overflow:hidden
, и текст все еще ломается.CSS: как остановить текст из более чем одной строки?
Нужно работать во всех браузерах, до CSS3.
Есть ли перенос слов или любой другой атрибут, который останавливает перенос текста? У меня высота, и overflow:hidden
, и текст все еще ломается.CSS: как остановить текст из более чем одной строки?
Нужно работать во всех браузерах, до CSS3.
div {
white-space: nowrap;
overflow: hidden;
}
<div>test that doesn't wrap</div>
Примечание: это работает только на блочных элементов. Если вам нужно сделать это для ячеек таблицы (например), вам нужно поместить div внутри ячейки таблицы, поскольку ячейки таблицы имеют отображаемую таблицу-ячейку, а не блок.
Начиная с CSS3, это поддерживается и для ячеек таблицы.
Иногда использование
вместо пробелов будет работать. Ясно, что у этого есть недостатки.
К сожалению, я не могу этого сделать – 2009-02-21 05:02:26
Для этого вы можете использовать CSS white-space Property
.
white-space: nowrap
Использование эллипса добавит ... в конце.
<style type="text/css">
div {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
</style>
white-space! Это то, что я искал ... 1,000 спасибо ... это невозможно для Google! – 2009-02-21 05:06:04
Существует также собственный атрибут, называемый word-wrap (IIRC) ... глупый IE. – garrow
Также рассмотрите «переполнение текста: эллипсис»; Он добавляет ... в конце вашего текста, если он выходит за пределы ширины вашего контейнера. –