Re: Form fields formatting ?

François de Dardel wrote:

Is there a way to differentiate e.g. between a genuine input field and
one that just returns the result of some calculation ?

I have given to the results fields the attribute "readonly", but is
there a way to make a visual difference, so the field does not _look_
like an input field ?

Don't use an input field, you aren't asking for user input with it after
all. Use JavaScript and the DOM to dynamically change the content of some
other element instead, a <span> for example.

--
David Dorward <http://dorward.me.uk/>

David Dorward <dorward (AT) yahoo (DOT) com> wrote:

François de Dardel wrote:

Is there a way to differentiate e.g. between a genuine input field
and one that just returns the result of some calculation ?

I have given to the results fields the attribute "readonly", but
is there a way to make a visual difference, so the field does not
_look_ like an input field ?

Don't use an input field, you aren't asking for user input with it
after all. Use JavaScript and the DOM to dynamically change the
content of some other element instead, a <span> for example.

Well, that's one approach, but the way that works most often is indeed
the use of an <input> element, no matter how illogical that is.

There's very little one can do about input field appearance in HTML,
but in CSS you can do quite a lot. It won't work on old browsers like
Netscape 4, but that should be tolerable - the data is still available.
The following removes the border, sets a light background color,
right-aligns the content (somewhat debatably, but IE behaves this way)
and sets the font to normal-size Arial. Note that font-size: 100% is
not redundant, since in many browsers the font size in input fields is
by default smaller than in copy text (which is rather odd).

<input readonly name="result" size="6" style=
"border: none; background: #eee; color: black;
display: block; text-align: right;
font-family: Arial; font-size: 100%">

Of course, using classes and an external style sheet (or a <style>
element) is normally preferable - this was just a quick example about
styling a single element.

--
Yucca, http://www.cs.tut.fi/~jkorpela/
Pages about Web authoring: http://www.cs.tut.fi/~jkorpela/www.html