[thelist] CSS technique for forms?

[John.Brooking at sappi.com]

Okay, I've been converted to laying out pages with CSS instead of tables,
but also not gone too far the other way by attempting to use only CSS when I
really do a have a rectangular set of values to display. But there seem to
me to be a number of gray areas, and one is them is forms. Specifically, the
standard format of one value per line with a label in front, such as:

   Name:  XXXXXXXXXXXXXXXXXX
   
   Email: XXXXXXXXXXXXXXXXXXXXXXXXXXXXX
   
   Phone: XXXXXXXXXXX
   
Tables were an easy way to vertically align the labels and the fields, but
of course suffer the same problems as using tables for page layout. But what
are the alternatives? I see two:

   1) Use separate DIV for the labels and the fields, positioning them next
to each other. I haven't actually tried this, because I suspect it would be
a pain to ensure that the label and the its field line up appropriately,
since they will wrap independently this way. Plus there are all the
cross-browser problems with positioning and floating. Yuck.
   
   2) Put each label/field pair in a P tag, with the label in a SPAN, and
set a width on the SPAN. You could either make each SPAN the same class, or
put the whole thing in a named DIV and define the width for any SPAN within
that named DIV. Either way, it's a little bit of a pain putting each label
inside a SPAN, but probably still better than the table alternative. This is
what I generally do.
   
Are there other techniques?
	
- John
-- 

This message may contain information which is private, privileged or
confidential and is intended solely for the use of the individual or entity
named in the message. If you are not the intended recipient of this message,
please notify the sender thereof and destroy / delete the message. Neither
the sender nor Sappi Limited (including its subsidiaries and associated
companies) shall incur any liability resulting directly or indirectly from
accessing any of the attached files which may contain a virus or the like.