Info

With table-o-matic you can create "correct" HTML Tables just by entering the needed values.
HTML Tables are the main core of good web design. However, doing tables that look the same on all browsers and really have the correct pixel widths is harder to do than one might think. During the process of creating various web pages Christian Heilmann from OnlineTools.org has created a way of coding tables, that proved to render correct results in all browsers. With this table wizard you can create them without the pain staking tag-by-tag typing required to render perfect cross browser tables.

   Usage

To create your table simply put in the appropriate values. Non-entered values will not be included in the code.
The font and stylesheet definitions will only be included when their checkbox is checked. After creating the code you can simply copy + paste it.

The resulting table looks like that:
<table width="1" border="1" cellpadding="1" cellspacing="1">
   <tr>
       <td width="1"><img src="blank.gif" width="1" height="1" alt=""></td>
       <td width="100"><img src="blank.gif" width="100" height="1" alt=""></td>
   </tr>
   <tr>
       <td align="center" valign="middle" bgcolor="green">
           <font  face="arial" size="2" color="black" >
               <div class="text">
             1_1
               </div>
           </font>
       </td>
       <td align="center" valign="middle" bgcolor="green">
           <font  face="arial" size="2" color="black" >
               <div class="text">
             1_2
               </div>
           </font>
       </td>
   </tr>
</table>

This way of coding a table has several opportunities:

• The widths stay fixed, text inside the cells will span more lines when it's too long
• If you have to change the width of the table, you only have to alter the values in the first row, the others will be changed accordingly
• The sourcecode is easy readable, as there are no width definitions in the cells themselves.

   Launch/Download

---

<table> definitions

---

borderwidth:      cellpadding:      cellspacing:  

---

<td> meta definitions

---

td-widths, divided by ",":
rows:    blank gif:

---

<td> definitions

---

background color:       fill cells with x_x
horizontal alignment: left center right    vertical alignment:   top middle bottom

---

   <font>definitions

---

face:   color:     size:  

---

  ccs-definitions

---

class name:

.::CODE::.