forms, text-fields & fonts...

[Food Groupy]

hello html-ers

when I create a simple form with some single-line text <input> fields, the
"default text" that appears in the empty field is ARIAL. When I create a
multi-line <text area> field, the default text appears as a "courier" type
of monospaced font.

This is odd.

Is there a "fix" for this, or is this an IE6 kind-of-thing...?

thanks,

Franko Dog

 

[Adrienne]

hello html-ers

when I create a simple form with some single-line text <input> fields,
the "default text" that appears in the empty field is ARIAL. When I
create a multi-line <text area> field, the default text appears as a
"courier" type of monospaced font.

This is odd.

Is there a "fix" for this, or is this an IE6 kind-of-thing...?

thanks,

Franko Dog

<style type="text/css">
textarea, input {font-family: sans-serif}
</style>

Although there is a reason for this behavior. You see, in a textarea,
sometimes it is necessary for the user to know how many characters they
have typed. If the textarea's COLS attribute is set to 10 and the ROWS
attribute is set to 2 the user can see when they are getting close to 20
characters. Because with monospaced fonts making all the letter the same
width, one can tell at a glance how many character have been typed.

 

[Jukka K. Korpela]

when I create a simple form with some single-line text <input>
fields, the "default text" that appears in the empty field is ARIAL.

Probably not. You'll see the difference if you try
<input value="abcdefg"><br>
<input value="abcdefg" style="font-family:Arial">

IE 6 uses by default some sans-serif font other than Arial. I haven't
identified what its name is. It's similar to Arial, but if you look at
it, you'll see quite a many small differences, including a bit larger
inherent spacing between letters in Arial.

When I create a multi-line <text area> field, the default text
appears as a "courier" type of monospaced font.

Hardly. It's probably "Courier New", which is quite different from
"Courier" (and much better, partly because Courier is a bitmap font,
which misbehaves badly when the font size is increased).

This is odd.

Not really.

Is there a "fix" for this, or is this an IE6 kind-of-thing...?

For example,

<style type="text/css">
input, textarea, option, button { font-size: 100%; }
input, textarea { font-family: Arial, Helvetica, sans-serif; }
</style>

The first rule there is not dummy. First, it sets text size in form
fields the same as in normal text, opposite to common browser default of
about 90%. Second, it makes the text size there scaleable. Try a page
containing a form without such a rule, and use the browser settings to
set text size to maximum; normal text gets resized (unless you did
something to break that functionality), text in form fields does not.

The second rule sets, of course, the font size in all input and textarea
elements the same, namely Arial if available, Helvetica otherwise, or a
browser-defined sans-serif font if neither of those two fonts is
available (which is pretty rare).

 

[David Håsäther]

IE 6 uses by default some sans-serif font other than Arial. I
haven't identified what its name is.

Looks like it's Microsoft Sans Serif.

 

[Jukka K. Korpela]

Looks like it's Microsoft Sans Serif.

Known as "MS Sans Serif", it seems. Thank you. I vaguely remembered it
was something like that but could not find it in the font menu of IE!
Strange.

 

[David Håsäther]

Known as "MS Sans Serif", it seems.

Actually, I have both MS Sans Serif and Microsoft Sans Serif installed.
The latter one seems to have more characters.

 

[Toby A Inkster]

Known as "MS Sans Serif", it seems. Thank you. I vaguely remembered it
was something like that but could not find it in the font menu of IE!

"MS Sans Serif" is bitmapped. Probably your menu only shows TrueType?