HTML Fieldset Tutorial

A simple fieldset looks like this:

That's pretty plain Jane, but you can really dress up a fieldset element using CSS. For a good example, take a quick look at my sales page for 101 Writing Tips. Scroll down and look at the fieldset for the free bonus product and the fieldset to order the product.

Back so soon? Pretty neat, eh?

Here's the code for the simple fieldset show above:

<fieldset>
<legend>Fieldset Legend</legend>
Name: <input type="text">
<p>
Email: <input type="text">
</p></fieldset>

Pretty simple, McGloopingham!

You can use a fieldset to group all kinds of items: products, thumbnail images, form fields, etc. I use them for order boxes, to highlight free bonuses, and to organize forms. You may have even better uses in mind!

Based on your interest in this tutorial you may also be interested in:

• Legend Tag Tutorial
• Forms Made Easy
• CSS Made Easy