TextArea、Text、Input、Field的輸入框，加上寬 width 100% 右邊會溢出(突出/破界)的可能，造成文字框的寬度超出100百分比。就算模板的#wrapper或是body加入padding或margin標籤，設定內外邊框的左右兩邊間隔空間，也是沒有用的。請看下邊的圖片

這個很早前HTML留下的詬病，以前如果一定要設定寬100，就需要編寫大量的代碼去構建。不過現在有了CSS3的出現，而且現在大部份的瀏覽器都跟上了，這個就來得簡單多了。

textarea {
padding: 0;
width: 100%;
box-sizing: border-box;
height: 300px;
border: 1px solid #E1E100;
background: #F5FFFA;
overflow: auto;
}


大家應該發現了以上的CSS代碼加上: box-sizing : border-box 在textarea 標籤，其他Text、Input、Field標籤也適合。

這是CSS3的新標籤屬性，只要用戶使用的瀏覽器遵從W3C標準，一律支持。

但如果你的網站瀏覽者多是使用IE6或IE7，這就需要考慮一下了。

已通過測試的瀏覽器: IE11、Edge、Firefox、Chrome、Safari、Opera

預覽效果Demo▼