VDS за 300р от нашего партнера SpaceWeb

ufo51 [76]

19 Дек 2012, 12:13

Растянуть input, textarea на 100%

css html

Привет!

Задался вопросом, как растянуть поля input и textarea на 100% и что бы они не выходили за рамки своего родителя. Ведь если поле имеет padding и border, то эта часть не входит в 100% размера, что очень глупо. Сейчас убрал border и padding и реализую их у элемента контейнера, но это не очень удобно. Кто, что посоветует?

102 просмотров

Комментарии (2)

glottis 20.12.2012 12:46

Примените свойства box-sizing, для элементов формы которые нужно растянуть.

box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;

nightkon 27.03.2013 14:39

glottis, предложил очень хороший вариант. Минус в том, что IE до 7 версии не поддерживает это свойство, а с остальными браузерами всё отлично. Можно использовать этот вариант и для IE7 и ниже сделать хаки.
Пример: http://jsfiddle.net/nightkon/8nQQa/

Также есть способ - кроссбраузерный.
Пример: http://jsfiddle.net/nightkon/WgUdM/

Добавить комментарий Отменить ответ

Для отправки комментария вам необходимо авторизоваться.

Войдите, чтобы написать о чем-нибудь...

Вход Регистрация

Web.onRails

Найди ответ на любой вопрос по Веб-разработке!

задать вопрос...

Вы можете разместить Рекламный пост самостоятельно, либо отправив контент по адресу admin@webonrails.ru→ Оплата здесь ←Неоплаченные посты удаляются.

Метки:

php× 491

css× 225

python× 209

html× 188

flash× 163

mysql× 155

linux× 153

perl× 138

google× 109

dart× 102

[ все метки ]

Лучшее

kiker [1]

15 Апр 2021, 08:29

Переполнение памяти Nuxt.js

[просмотров 40799]

fullzilla [100]

19 Дек 2014, 16:16

User-agent для Internet Explorer 11

[просмотров 39166]

tetro [52]

16 Окт 2011, 15:38

Вывести все элементы POST

[просмотров 37999]

GM2mars [2]

03 Июн 2014, 17:19

Большой сборник интернет сайтов по веб-разработке и не только

[просмотров 29423]

rediska [65]

20 Дек 2011, 15:53

Удалить пробелы в начале и конце строки и переход на новую строку

[просмотров 26076]

jaga [125]

24 Окт 2018, 15:59

React Native и React.js — что и как, в чем разница, где применять

[просмотров 17218]

gollem [74]

31 мая 2011, 11:48

Python проверка существования переменной

[просмотров 14941]

jaga [125]

21 Июл 2011, 14:04

Python Imaging Library (PIL)

[просмотров 12109]

laborant [4]

10 Окт 2018, 15:33

Как запретить просмотр сайта по IP?

[просмотров 11087]

provod [50]

31 Дек 2011, 14:57

Cron запускать раз в неделю

[просмотров 9423]

Вести с Хабра

30.01.2023 - 18:07

Как жили наши предки 400 лет назад? Создание базы данных населения XVII века по южным уездам России

Можно ли найти конкретного человека, жившего в XVII веке? Выражаясь современным языком «пробить по базам». Оказывается, архивные документы хранят массу информации об обычных людях т ...

30.01.2023 - 14:33

Что такое мат.анализ и с чем его едят?

Давайте знакомиться: я Меликян Маргарита, кандидат физико-математических наук, уже 4й год работаю на мехмате МГУ и кафедре высшей математики МФТИ, а также несколько лет как препода ...

30.01.2023 - 14:17

SEO Выводы из утечки кода поисковика Яндекс

Я был в восторге, когда узнал об утечке проприетарного исходного кода Яндекса. И после анализа данных я должен сказать, что выводы оказались весьма интересными! Итак, без лишних сло ...

30.01.2023 - 13:34

[Перевод] Взлом ШГУ Hyundai Tucson

Вторая часть истории о том, как можно взломать официальную прошивку Hyundai Tucson 2020 года выпуска и напичкать её чем-нибудь не очень полезным. Начало можно ...

30.01.2023 - 12:00

Сжатие без потерь — главная концепция в нашей жизни

Бывало так, что из долгой поездки вы помните только несколько моментов? А все отп ...