W3C home > Mailing lists > Public > www-style@w3.org > March 2003

CSS3 Basic UI: suggest making it easy to arrange labels relative to form controls

From: Micah Dubinko <MDubinko@cardiff.com>
Date: Mon, 24 Mar 2003 18:55:18 -0500 (EST)
Message-ID: <BD2DBD26EE0BAA48B1A425C7BE7923002D026F@csmail.cardiff.com>
To: "'www-style@w3.org'" <www-style@w3.org>



One proposal I have heard often is that the 'caption-side' property ought to
apply to a form control, to give general guidance on how the label should be
situated relative to the active portion of the form control.

Upon consideration, I don't think 'caption-side' is appropriate here (unless
other table styling is present). Something similar is needed, independent
from tables.

I suggest 'label-side', with possible values of 'above', below', before',
and 'after'. (The last two would respect LTR and RTL text directions).

Example:

<xforms:input bind="whatever">
  <xforms:label>Label</xforms:label>
</xforms:input>

With the following CSS applied:

@namespace xforms url(http://www.w3.org/2002/xforms/cr);

xforms|input { label-side: above; text-align: left }

would result in something like the following:
WARNING: ASCII art follows:

Label_________
|_____________|

I'm not fixated on this solution--anything that's easy to author and can
accomplish a similar effect is welcome.

Thanks!

.micah
Received on Tuesday, 25 March 2003 11:23:58 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Monday, 27 April 2009 13:54:20 GMT