Webmaster Forum / HTML, CSS, Scripts / CSS / February 2007

Scripsit dubing@gmail.com:

From the styling point of view, <legend> is a nightmare. The common
rendering of <legend> in browsers cannot be described in CSS terms, and CSS
settings have varying effects on it.

One of the problems is that normal wrapping does not take place, and setting
white-space: normal doesn't change this. You can insert explicit line breaks
in the markup, using <br>, but that would be awkward.

From the markup point of view, the problem of excessively long <legend>
texts should not appear. According to the HTML 4.01 specification, "The
LEGEND element allows authors to assign a caption to a FIELDSET. The legend
improves accessibility when the FIELDSET is rendered non-visually." It has,
among other things, the following example:

<FIELDSET>
 <LEGEND>Current Medication</LEGEND>
 Are you currently taking any medication?
 <INPUT name="medication_now"
 ...
 </FIELDSET>

So the general idea is that the legend is a short caption, or like a
low-level heading. Without context, it is of course impossible to make a
specific suggestion on the formulation. But generally, a legend that needs
to wrap (in fairly normal browsing situations) is too long and needs
reformulation.

Just put the questions inside the <fieldset> after the <legend> element.

Bolding long texts is generally counter-productive, since bold text is more
difficult to read. The legend might be bolded, but the question should be
normal text so that it can be read conveniently.

For all that you can know, 450px might not accommodate a _word_ without
wrapping. Stop imposing fixed widths, _especially_ on forms. A page with a
form is not supposed to be primarily an esthetic experience but a user
interface. Let form follow function. The user may need all the space
available.