How to make an element width: 100% minus padding?

前端 未结 14 1452
庸人自扰
庸人自扰 2020-11-21 07:33

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 widt

14条回答
  •  忘了有多久
    2020-11-21 08:21

    box-sizing: border-box is a quick, easy way to fix it:

    This will work in all modern browsers, and IE8+.

    Here's a demo: http://jsfiddle.net/thirtydot/QkmSk/301/

    .content {
        width: 100%;
        box-sizing: border-box;
    }
    

    The browser prefixed versions (-webkit-box-sizing, etc.) are not needed in modern browsers.

提交回复
热议问题