如果在文本框内单击，请按住鼠标按钮并开始上下拖动，文本框将在容器内移动。问题仅在WebKit中。
重要的是不要更改隐藏了溢出的绝对容器内部的输入结构
http://jsfiddle.net/V66ts/
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>
<style type="text/css">
.inputOverGateContainer
{
top:0px;
width: 100px;
height: 22px;
background-color: transparent;
position: absolute;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
border-radius: 10px;
overflow: hidden;
z-index: 5;
padding-left:3px;
padding-right:3px;
-webkit-touch-callout: text;
-webkit-user-select: text;
-khtml-user-select: text;
-moz-user-select: text;
-ms-user-select: text;
user-select: text;
}
.inputOverGate
{
font-size:17px;
background-color: #fff;
border: 1px solid #000;
outline: none;
width: 100%;
height: 100%;
color:#8292b4;
text-shadow: 1px 1px 3px #000;
-webkit-touch-callout: text;
-webkit-user-select: text;
-khtml-user-select: text;
-moz-user-select: text;
-ms-user-select: text;
user-select: text;
}
</style>
</head>
<body>
<div class="inputOverGateContainer"><input class="inputOverGate" name="" type="text"></div>
</body>
</html>
最佳答案
您需要删除.inputOverGate类的高度声明。我已经更新了您的小提琴，演示了：http://jsfiddle.net/V66ts/1/