Стандартизируйте полную высоту и ширину <input>, <select>и <button> - PullRequest
3 голосов
/ 30 июля 2011

Я хотел бы стандартизировать всю ширину и высоту (то есть ширину и высоту , включая отступы и границы и т. Д.) В <input>, <select> и <button> без потери родные стили, используемые браузерами по умолчанию.

Возможно ли это? Я открыт для использования обнаружения браузера и JavaScript в дополнение к CSS.

1 Ответ

8 голосов
/ 30 июля 2011

Используйте

input, select, textarea, button{

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

, если хотите, чтобы отступы и границы поели с ширины

Демо на http://jsfiddle.net/gaby/WaxTS/222/


Используйте

input, select, textarea, button{
    -ms-box-sizing:content-box;
    -moz-box-sizing:content-box;
    -webkit-box-sizing:content-box;
    box-sizing:content-box;
}

, если вы хотите, чтобы отступы и границы были добавлены к ширине.

демонстрация на http://jsfiddle.net/gaby/WaxTS/224/

уведомление для этого случая,кнопки не будут соответствовать остальным элементам, потому что они имеют разные границы, и если вы возитесь с этим, вы отключите собственный вид.

...