Input text box scrolling
I currently am having a problem with HTML <input type="text">
,
as in the Google Chrome browser, if I use the below CSS,
when I type text into the box, I am able to highlight the text
and drag it up and down, as if it is scrolling a little 2px,
due to the text larger than the input box.
Can anyone help me solve my problem, and prevent the dragging to scroll up and down the 2px?
Many thanks!
input {
border: 0px;
font-family: 开发者_运维百科"Courier New", Courier, monospace;
font-size: 13px;
color: inherit;
margin: -1px;
background: none;
}
Specify:
input{ vertical-position:middle; line-height: * your input field height * }
And specifically for IE specify:
input{ vertical-position:bottom; }
otherwise IE will show the text in the upper part of the input.
input {
border: 0px;
font-family: "Courier New", Courier, monospace;
font-size: 13px;
color: inherit;
margin: -1px;
background: none;
line-height:10px
}
reducing the line height should solve your problem. And don't use negative margin on a textbox. If you want to position it, wrap it in a div and then position, else if you doing it with a label, use negative margin for label to pull the input close to it.
精彩评论