Web页面输入框相同尺寸不同长度的问题

项目开发使用JAVA、Weblogic、MyEclipse，当用到下面的代码时，页面输入框长度不相同，百思不得其解。

<t:panelGrid cellpadding="0" cellspacing="0" border="0"

	style="vertical-aligh:bottom">

		<t:outputText value="#{bundle.LABEL_USERNAME}"

			styleClass="loginlabelWhitetxt" />

		<t:inputText

			value="#{login.state.modelProperties.loginName}" size="18"

			styleClass="grooveflatblackleftright" />

</t:panelGrid>

<t:panelGrid cellpadding="0" cellspacing="1" border="0"

	style="height:40px;vertical-aligh:top">											

		<t:outputText value="#{bundle.LABEL_PASSWORD}"

			styleClass="loginlabelWhitetxt" /> 

		<t:inputSecret

			value="#{login.state.modelProperties.password}" size="18"

			styleClass="grooveflatblackleftright" />

</t:panelGrid>

通过使用IE developer toolbar我发现两个输入框的字体不相同，一个是Arial，另外一个是Tahoma。所以只要在css中定义好就没有问题了。其实密码框使用Tahoma是通用方法，还不清楚具体的原因，如果有高手知道望指点一二。

还有，在IE中默认的字体大小为10pt，但是在firefox中默认的是12pt，所以，如果不在css中重新定义的话，firefox的输入框会非常宽。