I know it's bad to use HTML Tables for everything... and that tables should be used only to present tabular data and not to achieve some style goal.
My question is, how do you make HTML forms with CSS so they look nice and aligned like when using tables?
The below table gives you the relation between a 'table' tag and the corresponding supported CSS property to represent the same element. So, when creating a table, all you need to do is, instead of the HTML 'table' tag, merely use the 'div' tag and add the corresponding CSS to display a table.
The elements used in an HTML form are check box, input box, radio buttons, submit buttons etc. Using these elements the information of an user is submitted on a web server. The form tag is used to create an HTML form.
HTML tables were originally intended to be used for presenting tabular data, not for layout. The World Wide Web Consortium (W3C®) discourages use of tables for layout because they are striving for a web in which content and structure are completely separate from presentation.
Click/Tap the ellipses for the form you want, and choose Edit. Manage the fields of the form. The Submit button is automatically added when the form has one or more fields. To add a new field, drag and drop a field type to the canvas, then configure its settings.
Nick Rigby wrote an excellent article for A List Apart titled Prettier Accessible Forms
Uses fieldset, legend, label. Highly semantic.
Take a look at the code used in wufoo forms, they use ul's to format the forms and they look really good.
http://wufoo.com/gallery/templates/
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With