我在页面上有一个文本输入字段,但是,我发现很难尝试在webkit(Chrome + Safari)中垂直居中。它在FireFox中很好。
以下是代码:
<form action="/" method="get">
<input type="text" name="s" id="search" class="search" size ="34" value="Search..." onblur="if(this.value == ''){ this.value = 'Search...'; this.style.color = '#BBB';}" onfocus="if(this.value == 'Search...'){ this.value = ''; this.style.color = '#000';}" />
<input class="schbtn"ntype="submit" value="" />
</form>
CSS:
.schbtn {background:url(/wp-content/themes/shamil/images/search_icon.png) no-repeat scroll 50% 50% #7BA60D;height:26px; width:26px;}
#navtabs li.rnavtab input{border:0;padding-left:5px;color:#BBB;}
这是影响它的唯一两个。
对于想要查看此操作的用户,请访问http://shamil.la,然后观察Firefox和Safari / Chrome中的搜索字段。它把我的头抬到了墙上。
由于
答案 0 :(得分:3)
在两个输入元素上放置vertical-align:middle;
,这将使其居中