Question

我有一个使用背景的样式搜索框，每当我点击该框时，光标闪烁的颜色大于文本框，直到我键入正确大小的位置。

这是HTML -

<div class="row2 zero_padMarg floatRight">
 <label for="srcTxt" title="search form">search</label>
 <input type="text" id="srchCom" name="srcTxt" class="validate[required,length[3,75]] text-input txtBox">
 <input type="submit" class="searchSubBtn" value="submit" title="submit search" name="submit">
</div>

.searchBlock input#srchCom {
    background:url("../images/srchSml.gif") no-repeat scroll left top transparent;
    border-style:none;
    font-size:11px;
    height:23px;
    line-height:normal;
    overflow:hidden;
    text-indent:24px;
    vertical-align:bottom;
    width:160px;
}

有关跨浏览器解决方案的任何想法吗？

感谢您的帮助保罗

Answer 1

你不能改变<input>的身高吗？

Answer 2

我尝试使用填充来表明内容高度与字体大小相同。添加：

padding: 6px 0;

...并将整体高度降低到与font-size相同的高度：

height: 11px;

这对我来说就像是一个Firefox bug。

Answer 3

嗯，实际上我尝试删除文本框的高度并为顶部和底部提供了适当的填充，它对IE和Firefox都很有效。

使用CSS样式化图像文本输入框放置光标

3 个答案: