Documentation on <FIELDSET> <LABEL> tags instead of using TABLE's?

Question

I've just come across these in MVC, and would like to use them instead of tables sometimes, as tables and DIV's just don't mix well!

Never seen these before, and was wondering if there is any documentation about these new table-substitute TAGs? I've also heard recommendations to use these as opposed to tables and would therefore like to familiarize myself with them properly (as opposed guessing how they work as I have been recently).

thanks

ps: these things did not exist in HTML when i studied HTML, and i recall i studied HTML 4.0 ages ago, when it came out...

Answer 1

I don't think Fieldset's are new and they're not really a replacement for tables.

Found this explanation which pretty much sum's it up: "The HTML fieldset tag is used for grouping related form elements. By using the fieldset tag and the legend tag, you can make your forms much easier to understand for your users."

w3schools is always useful for HTML tags info. A quick look around seems to suggest it was introduced in HTML4.0

Answer 2

A fairly standard way of using fieldsets to contain form elements is just to use it as a basic building block, like a div. Think of it as a containing div that has semantic value and that you can use the legend element in. Fairly basic XHTML for this:

<fieldset>
  <div>
    <label for="x">Thing</label>
    <input type="text" id="x" name="x" />
  </div>
  <div>
    <label for="y">Thing</label>
    <input type="text" id="y" name="y" />
  </div>
</fieldset>

(The div is pretty necessary for IE6 and handy nonetheless.) Then in CSS you format the fieldset and such accordingly. For instance, you'll usually want to suppress the normal border a fieldset is given.

fieldset { border: 0; }
fieldset.display { border: 1px solid #cccccc; }
/* You can always invert this. Up to you. */

There's a lot of other things you'll need to do, but that'll get you started--it's pretty much just treating it as a semantic block element, like a div but with meaning, from here. Group your elements into logical groups, and if you ever need to differentiate it from the rest of the form, all you have to do is change the fieldset's class and add a legend.