I need to create a user registration form with a classic two-column layout, where labels are on the left and fields are on the right. The labels can be displayed in either English or French, resulting in varying label lengths.
When it comes to structuring the HTML, I'm torn between:
<form ...>
<ul>
<li>
<label ...>...</label>
<input ... />
</li>
</ul>
</form>
or
<form ...>
<table>
<tr>
<td><label ...>...</label></td>
<td><input ... /></td>
</tr>
</table>
</form>
Personally, I lean towards using a table layout because it's easier for me to align labels and fields vertically, especially with varying label lengths.
However, there's been a trend over the years to replace tables with divs and lists to avoid excessive table use for layout. While I appreciate good overall layout organization, I wonder if this also applies to user registration forms.
What are your thoughts on the pros and cons of each approach?