How can I use tables to structure forms?


Small forms are sometimes placed within a TD element within a table. This can be a useful for positioning a form relative to other content, but it doesn’t help position the form-related elements relative to each other. To position form-related elements relative to each other, the entire table must be within the form. You cannot start a form in one TH or TD element and end in another. You cannot place the form within the table without placing it inside a TH or TD element. You can put the table inside the form, and then use the table to position the INPUT, TEXTAREA, SELECT, and other form-related elements, as shown in the following example.





<form action=”[URL]”>

<table border=”0″>

<tr> <th scope=”row”>

<label for=”account”>Account:</label> </th>

<td> <input type=”text” name=”account” id=”account”>

</td> </tr> <tr> <th scope=”row”>

<label for=”password”>Password: </th>

<td> <input type=”password” name=”password” id=”password”>

</td> </tr> <tr> <td> </td> <td>

<input type=”submit” name=”Log On”></td> </tr>

</table> </form>



[ufbl form_id=”1″]


Please enter your comment!
Please enter your name here