Yet Another Divs vs Tables issue: Forms

Question

[Meta-note:] I was browsing the question page, getting really tired of \"DIVS vs Tables\" \"When to use tables vs DIVS\" \"Are Divs better than Tables\" \"Tables versus CSS\

Answer 1

People talk about tables getting their forms to display the way they want, that's true, ONLY if you want to display your forms in columns and are willing to lose semantic meaning. With the following HTML in place, it's possible to display this form in as many layouts as you might wish.

BTW - No to the


 

  
Personal Info
  

   Name
   
  
  

   Social Security Number
   
  
 

You can clear the or set them to overflow: hidden to ensure that the floats are cleared.

Options from the above html:

Name |==============|    SSN |==============|

Name |==============|
SSN |==============|

Name     |==============|
SSN      |==============|

    Name |==============|
     SSN |==============|

   Name: |==============|
    SSN: |==============|

Name:
|==============|
SSN:
|==============|

All of the above can be accomplished with just a few lines of css.

When it comes to radio, checkboxes, and submit buttons it gets a little more complicated, but clean semantic HTML CAN be displayed the way you want it using css.