Back
I have an HTML input.
The input has padding: 5px 10px; I want it to be 100% of the parent div's width(which is fluid).
However using width: 100%; causes the input to be 100% + 20px how can I get around this?
Example
Try using box-sizing: border-box.
Refer to this demo: http://jsfiddle.net/thirtydot/QkmSk/301/
.content { width: 100%; box-sizing: border-box;}
.content {
width: 100%;
box-sizing: border-box;
}
Note: The browser prefixed versions (-webkit-box-sizing, etc.) are not needed in modern browsers
Refer to this: https://caniuse.com/#feat=css3-boxsizing It will work in all modern browsers and IE8+.
31k questions
32.8k answers
501 comments
693 users