TextField Display problems:

Netscape will make the text field more than 250 pixels wide, a 60% difference!

That difference can often wreck your page layout. If you place your form inside a table with a carefully determined width, having a form element grow by 60% may cause parts of page layout be pushed to one side.

The solution to this is to be careful where your close your FONT tag. In our example, closing the FONT tag just before the INPUT tag solves the problem.

<FORM METHOD="GET"
ACTION="/cgi-bin/subscribe.cgi">
<FONT FACE="arial" SIZE="2">
Enter Your Email Address:
<BR>
</FONT>
<INPUT TYPE="text" NAME="email" SIZE="20">
<BR>
<INPUT TYPE="submit">
</FORM>

Another solution is to use javascript to write the various sizes - as the page loads, a size for netscape and a different one for IE. (Later we'll see how to choose a page or function based on browsers, screen, etc. used)

Here's the code:

<CENTER>
<FORM NAME = form1>
<INPUT TYPE = TEXT NAME = Textbox SIZE = 20 VALUE = "You can resize this box.">
<BR>
<BR>
<INPUT TYPE = BUTTON Value = "Resize text box" onClick = "ResizeTextbox()">
</FORM>
</CENTER>

</BODY>

<SCRIPT LANGUAGE = JavaScript>
function ResizeTextbox()
{
document.form1.Textbox.size = 40
document.form1.Textbox.value = "This text box was resized."
}
</SCRIPT>

</HTML>