2013-06-12 60 views
-4

我有一個問題,這是一個錯誤的例子。

http://jsfiddle.net/kHSNC/1/

我想修復輸入寬度,使其等於提交按鈕而不使用像素尺寸。我會用.span8類input-textarea寬度太大

.span8 {width: 500px;} 


感謝

+1

**這是一個錯誤的例子。**你的小提琴是錯的還是你的意思是說代碼錯了? –

+1

粘貼鏈接到JSFiddle沒有代碼示例的副本在這裏是不滿的。請參閱[我的網站或項目中的某些內容不起作用。我可以只粘貼一個鏈接嗎?](http://meta.stackexchange.com/questions/125997/something-in-my-web-site-or-project-doesnt-work-can-i-just-paste -a-link-to-it/126000#126000) –

+0

這是我的代碼,它是錯誤的,因爲面積太大,比.span8類 – Ganjalf

回答

1

Working jsFiddle Demo

剛剛成立的input寬度和textarea以像素爲單位,而不是百分比:

.contact-form input { width: 470px; } 
.contact-form textarea { resize: vertical; width: 470px; } 

設置padding的元素,增加了計算的寬度,所以當你有這樣的事情:

.parent { width: 500px; } 
.parent .child { width: 100%; padding: 15px; } 

孩子的計算寬度,將530px

+1

也許值得一提的是,你可以改變這個行爲https://developer.mozilla.org/en-US/docs/Web/CSS/box-sizing – xec

+0

@xec不幸的是,'box-sizing'屬性並不完全支持通過瀏覽器,請參閱[我可以使用](http://caniuse.com/css3-boxsizing)。 – 2013-06-12 07:38:03

+1

完全知道。在我發佈的鏈接上也有一個兼容性列表,但缺少支持是可以忽略的(IE7已經死了),也請查看http://www.paulirish.com/2012/box-sizing-border-box-ftw/ – xec