輸入文本框滾動

目前我有一個問題與HTML <input type="text">，如谷歌Chrome瀏覽器，如果我用下面的CSS，當我鍵入文本框，我能夠突出顯示文本和將其上下拖動，就好像它正在滾動一點點2px，由於文字大於輸入框。輸入文本框滾動

任何人都可以幫助我解決我的問題，並防止拖動滾動上下2px？

非常感謝！

input { 
    border: 0px; 
    font-family: "Courier New", Courier, monospace; 
    font-size: 13px; 
    color: inherit; 
    margin: -1px; 
    background: none; 
}

來源

2010-12-16 initialshl

您有一個負邊界。這不是說文本區大於它的大小嗎？ – Robert 2010-12-16 04:31:06

我正在嘗試使輸入框完全適合文本輸入，如果您看到所有輸入框都沒有小的1px邊距。 – initialshl 2010-12-17 05:38:10

任何人都可以幫我嗎？這裏是我的問題的一個例子：http://picopicopixel.com/index.html – initialshl 2010-12-17 06:58:59

input { 
    border: 0px; 
    font-family: "Courier New", Courier, monospace; 
    font-size: 13px; 
    color: inherit; 
    margin: -1px; 
    background: none; 
    line-height:10px 
}

減少線路高度應解決您的問題。並且不要在文本框上使用負邊距。如果要定位它，請將其包裝在一個div中然後放置，否則如果您使用標籤進行定位，請使用負邊距標籤將其拉近。

來源

2010-12-16 04:49:57 Tarun

嗨！感謝您的幫助。但我仍然無法解決我的問題。我嘗試使用10px，1px和0px行高，但它仍然無法工作。我試圖使它與Courier字體的文本看起來一樣，因爲輸入框會在所有邊緣將它們分開。我仍然可以在各種行高中在Chrome中上下拖動和滾動它們。 – initialshl 2010-12-16 06:38:07

請給我鏈接到您的網頁 – Tarun 2010-12-16 06:50:40

嗨，它可以在http://picopicopixel.com/index.html找到謝謝！ – initialshl 2010-12-16 07:39:19

指定：

input{ vertical-position:middle; line-height: * your input field height * }

而且專門爲IE指定：

input{ vertical-position:bottom; }

否則IE將顯示在輸入的上部的文本。

來源

2011-04-13 11:19:23 Dean

爲我調整行高固定的東西。 IE不喜歡輸入框的行高>高度。 – 2011-04-18 17:16:52

指定：line-height ==輸入框的高度。這應該解決它 – Dean 2011-04-20 10:01:41

輸入文本框滾動

回答

相關問題