Как запретить изменение размеров ?
Сделать, чтобы размеры текстового поля созданного через тег не изменялись при помощи мыши.
Решение
В современных браузерах Firefox, Safari и Chrome в правом нижнем углу текстового поля есть небольшой уголок (рис. 1) с помощью которого мышью можно изменить размеры поля.
Рис. 1. Вид текстового поля в браузере Chrome
Вид уголка различается, но его функции остаются одинаковыми, если щёлкнуть мышью и потянуть за уголок, то можно изменить размеры поля. Чтобы запретить эту возможность, следует для селектора textarea задать свойство resize со значением none (пример 1).
Пример 1. Использование resize
HTML5 CSS3 IE Cr Op Sa Fx
Размеры текстового поля Запретить изменение размера textarea
HTML textarea. Как убирают элемент изменения размера на HTML или CSS?
Отслеживать
задан 20 апр 2016 в 21:19
3,998 5 5 золотых знаков 21 21 серебряный знак 35 35 бронзовых знаков
20 апр 2016 в 21:22
@АлексейШиманский спасибо, надо было оформлять как ответ:)
21 апр 2016 в 10:28
1 ответ 1
Сортировка: Сброс на вариант по умолчанию
textarea < resize: none; /* Запрещаем изменять размер */ >Отслеживать
ответ дан 20 апр 2016 в 21:22
3,021 11 11 серебряных знаков 23 23 бронзовых знака
- html
- css
-
Важное на Мете
Похожие
Подписаться на ленту
Лента вопроса
Для подписки на ленту скопируйте и вставьте эту ссылку в вашу программу для чтения RSS.
Дизайн сайта / логотип © 2024 Stack Exchange Inc; пользовательские материалы лицензированы в соответствии с CC BY-SA . rev 2024.1.3.2953
Нажимая «Принять все файлы cookie» вы соглашаетесь, что Stack Exchange может хранить файлы cookie на вашем устройстве и раскрывать информацию в соответствии с нашей Политикой в отношении файлов cookie.
Как запретить растягивание textarea
Тэг TextArea — незаменимое поле ввода для текста. Современные браузеры по-умолчанию позволяют пользователям изменять размеры, растягивать его за правый нижний угол. Сделано это с добрыми намерениями, но для верстальщика оборачивается не самыми приятными последствиями.
Вот пример формы, где разрешено изменение
Видим, что пользователь может изменить размеры, нарушив задуманную геометрию верстки.
Запретить изменение размера TEXTAREA
Первая мысль — это полный запрет изменения размера. Достаточно добавить стиль:
Как запретить изменение размеров textarea на CSS/jQuery?
Textarea – это поле для ввода различной информации на вашем сайте, и, в отличие от похожего тега «input», информация вводиться не в строку, а в столбец.
И по умолчанию – в нижнем правом углу этого поля есть небольшой уголок, который позволяет пользователю изменить размеры этого окна.
С одной стороны, это полезная функция, ведь пользователь при написании в это поле большого сообщения может изменить его размеры для того, что было визуально комфортнее воспринимать введенный текст, а с другой – не очень, так как из-за изменения размеров этого окна самим пользователем у вас может в прямом смысле «поехать» дизайн.
Поэтому в каких-то случаях нужно оградить пользователя от этой функции. Как именно – я сейчас расскажу.
Как запретить изменение размеров textarea на CSS?
Поставленная задача на CSS решается очень просто. Для этого нужно воспользоваться свойством «resize»:
С другой стороны, если вы все же хотите оставить возможность «растягивания» поля – вы можете воспользоваться свойствами «max-width» и «max-height»:
В таком случае растягивание поля разрешено, но только до указанных размеров.
Как запретить изменение размеров textarea на jQuery?
На jQuery эти же задачи решаются с помощью метода «css». Для полного запрета изменения размеров:
И для частичного ограничения соответственно:
Если вдруг какой-то из способов вам показался непонятным – пишите об этом в комментариях.