RWD - 寬度爲100％的元素

Question

我試圖創建我的網站的移動版本，但寬度爲100％和填充的任何元素都會溢出到我的容器部分。我明白這是因爲子元素比填充值的容器更寬，但是我怎樣才能保持它們的全寬，但是在子元素內保留了一些填充（因此文本不會粘在瀏覽器的窗口中）？

簡單代碼：

section#main { 
    padding: 100px 0 0 !important; 
    width: 100%; 
    } 
    input, textarea { 
    width: 100%; 
    padding-left: 20px; 
    margin: 0; 
    } 

結果：

http://tinypic.com/r/2ytxjk9/5

Answer 1

正如你基本上是說，100％的寬，但加上100像素填充。最簡單的解決方法是更改​​box-sizing: border-box CSS3屬性。這將使它100％寬，包括100px填充。