PDA

View Full Version : how to centralize the text in input field.


fattat
06-25-2009, 05:26 PM
how to centralize the text in input field.
in IE the text is show properly, but when open in firefox,
the text is moving up a bit.



in IE situation:
http://img177.imageshack.us/img177/7163/picture1kjh.png (http://img177.imageshack.us/i/picture1kjh.png/)


in firefox situation:
http://img99.imageshack.us/img99/7079/picture2lsm.png (http://img99.imageshack.us/i/picture2lsm.png/)



<div id="top">
<form name="serch" action="#" method="post">
<label>Search:</label>
<input type="text" name="name" value="- Enter keyword -" class="txtBox" />
<input type="submit" name="go" value="Go" class="btnGo" />
<label class="as"><a href="#">-Advance Search-</a></label>
</form>
</div>


#top form label{
display:block;
width:100px;
height:21px;
font:bold 13px/21px Arial, Helvetica, sans-serif;
color:#404040;
background-color:inherit;
float:left;
}
#top form input.txtBox{
width:120px;
height:19px;
border-left:#808080 solid 1px;
border-top:#808080 solid 1px;
border-right:#D4D0C8 solid 1px;
border-bottom:#D4D0C8 solid 1px;
background-color:#fff;
color:#ff0000;
padding:0 0 0 5px;
font:normal 10px/19px Arial, Helvetica, sans-serif;
margin:0 4px 0 0;
float:left;
}
#top form input.btnGo{
background:url(images/btn_go.gif) 0 0 no-repeat;
width:31px;
height:21px;
border:none;
cursor:pointer;
float:left;
background-color:#EDF8FC;
color:#fff;
font:bold 11px/21px Arial, Helvetica, sans-serif;
}
#top form label.as{
display:block;
width:97px;
height:21px;
background:url(images/advanced_serch.gif) 0 0 no-repeat;
float:right;
text-align:center;
}
#top form label.as a{
background-color:inherit;
color:#1D1D1D;
font:normal 10px/21px Arial, Helvetica, sans-serif;
text-decoration:none;
}
#top form label.as a:hover{
background-color:inherit;
color:#C70067;
}

fattat
06-27-2009, 04:52 AM
no one know??:confused: :confused:

MagicPower
06-27-2009, 06:32 AM
i would say create a new css rule for that input field and play around with the padding of the new css rule. While previewing make sure you do so in both browsers jus to make sure the padding balances out in all.

fattat
06-27-2009, 08:05 AM
i would say create a new css rule for that input field and play around with the padding of the new css rule. While previewing make sure you do so in both browsers jus to make sure the padding balances out in all.

how to settle it??

MagicPower
06-29-2009, 03:12 AM
wa d u mean?