Is it acceptable to use tables for forms? Or is it still more correct to use divs?

Question

I'm wondering whether it's acceptable to use tables for forms.

Strictly speaking, name/value pairs are tabular data, aren't they? And a form is just a user customisable set of name/value pairs. So is it right to use tables in this case? Or should I use divs styled with CSS?

Answer 1

Try fieldsets

I prefer to break up the fields into logical <fieldset>s with one <legend> each, because:

• The code is less cluttered
• The default formatting is user-friendly (I especially like how the legend displays)
• It's easy to style with CSS

Here's a code example. Note that the labels' for attribute lets you click that label to move focus to the input specified (it matches the id attribute).

<form>   <fieldset>     <legend>Wombat Statistics</legend>     <ol>       <li>         <label for="punchstrength">Punch Strength</label>         <input id="punchstrength" name="punchstrength" />       </li>       <li>         <label for="beverage">Favorite Beverage</label>         <input id="beverage" name="beverage" />       </li>     </ol>   </fieldset>   <fieldset>     <legend>Questions That Are Too Personal</legend>     <ol>       <li>         <label for="creditcard">What is your credit card number?</label>         <input id="creditcard" name="creditcard" />       </li>       <li>         <label for="gullibility">Did you actually fill that in?</label>         <input id="gullibility" name="gullibility" />       </li>     </ol>   </fieldset> </form> 

For a basic layout, you can use something like:

label, input, textarea, select {    display: inline-block; vertical-align: top; width: 30%;  } 

See this article for a more in-depth tutorial.

Answer 2

Both are correct.

I preffer using some div/li, as that allows me to make some different layouts, but tables for forms are not frowned upon.

Actually, by default, Django gives you table formated forms.