I am told I shouldn’t use tables for anything but tabular data. I’m looking for a way to correctly align form fields using DIVs.
With tables, I would do the following:
<TABLE>
<FORM>
<TR><TD>Field 1:</TD><TD><input type=text></TD></TR>
<TR><TD>Field 2:</TD><TD><input type=text></TD></TR>
</TABLE>
</FORM>
This can be built something like this:
<div>
<label for=”field1″>Field 1:</label>
<input id=”field1″ type=”text”>
</div>
<div>
<label for=”field2″>Field 2:</label>
<input id=”field2″ type=”text”>
</div>
And this is an example CSS I’ve used:
label {
width: 35%;
float: left;
clear: left;
text-align: right;
white-space: nowrap;
min-width: 5em;
}