Я хотел бы предоставить горизонтальную прокрутку в textarea на моей странице HTML. Свиток должен отображаться без обертывания, если я набираю длинную строку без разрыва строки. Несколько друзей предложили использовать атрибут CSS overflow-y, который не работал у меня. В браузерах, которые я использую, есть IE 6+ и Mozilla 3 +.
Текстовая горизонтальная прокрутка HTML Textarea
Ответ 1
Чтобы не устанавливать упаковку, вы должны использовать:
white-space: nowrap;
Для других значений: https://developer.mozilla.org/en-US/docs/Web/CSS/white-space
ПРИМЕЧАНИЕ. Однако обесценившийся wrap="off"
, по-видимому, единственный способ поддержки старого браузера. Хотя это не соответствует требованиям HTML 5, я по-прежнему предпочитаю, чтобы вы ориентировались на все браузеры.
Ответ 2
Я решил сделать это не-W3c-совместимым способом, и он работает как в IE, так и в Firefox, и, кстати, в Chrome тоже.
Я добавил атрибут wrap
со значением off
, то есть <textarea cols=80 rows=12 wrap='off'>
- это то, что я сделал.
Ответ 3
Если у вас есть предварительно отформатированный текст, который содержит LF, вы должны добавить white-space: pre;
к css. Это сохранит новые строки, которые уже есть в тексте, и не будет переносить длинные строки.
Это работает во всех версиях Firefox, во всех браузерах на основе Webkit и IE6+.
Источник: https://developer.mozilla.org/en-US/docs/Web/CSS/white-space
Ответ 4
Попробуйте следующее:
overflow: scroll;
overflow-y: scroll;
overflow-x: scroll;
overflow:-moz-scrollbars-vertical;
также должна быть строка -moz-scrollbars-horizontal