Add:   Delete:


Table generator/editor

Contact Bob Wallace at {HB} design if you have comments, questions, or suggestions

Notes/help - click to toggle

This is a tool for web developers. It is designed to make creating and editing tables easier. It allows you to copy and paste the table html and css code between this tool and your code editor.

To create a table, select the number of columns and rows in your table and whether or not you want thead and tfoot rows. You can add or remove classes at any time. Classes are row(n), col(n), odd, and even. View the table code to see the classes. You can also add colgroups to the table when you create it. Click the generate table button to display the results.

To edit existing tables, copy html tables from other pages and paste into the "view table code" window. Any tables you copy and paste in should have a single tbody tag.

Clicking the add classes checkbox will put odd/even and row/column classes on all cells in the tbody. Unchecking the box will remove all classes from the cells.

You can make cell changes by clicking on a cell and updating the content in the popup form. You can also set the span rows and span columns, add and delete rows and columns.

In addition there are undo and redo buttons that let you step forward and back through your edits. When done, click the view table code to see the code to copy and paste into your editor.

The css button allows your to view and edit the css rules being applied to the table.