CSS procent 宽度减去固定宽度

Question

我有一个填充，我想减去基于 procent 的设计。输入区域有该填充，但会使输入长度超过 100%。

谁能解释我的 css 出了什么问题：

input[type='text'] {
    padding:5px;
    width:calc(100% - 10px);
}

<input type="text" name="username" id="username" value="Username" />

Answer 1

为什么不直接使用：

input[type='text'] {
    padding:5px;
    box-sizing:border-box;
    width:100%;
}

见this fiddle和this article about box-sizing