table td tr arrangements

[andrewliu]

<form>
<table class="spon_info">
<tr><td>
<label for="add_street" style="font-size:12px;vertical-align:middle;padding-left:2px;">Street</label></td><td>
<input name="add_street" type="text" style="vertical-align:middle" value="" size="35" maxlength="50"/>
</td></tr>
<tr><td>
<label for="add_city" style="font-size:12px;vertical-align:middle;padding-left:2px;">City</label></td><td>
<input name="add_city" type="text" style="vertical-align:middle" value="" size="35" maxlength="30"/>
</td></tr>
<tr><td>
<label for="add_state" style="font-size:12px;vertical-align:middle;padding-left:2px;">State</label></td><td>
<input name="add_state" type="text" style="vertical-align:middle" value="" size="5" maxlength="2"/>
</td></tr>
</table>
</form>

I have this table and in that table has a column of names and a column of text fields. I was wondering how to make "city", "state", and "zip code" be next to each other with their individual cells?

Any suggestions?

Thank you

[diafol]

UNclear what you're to do. Do you want one line with all those fields? Or do you want all those labels in one td and all the inputs in another td??

[ko ko]

You mean 'Street' is one row and the others are another row together ?
You can merge the columns. Try this:

<form>
<table class="spon_info">
<tr>
<td colspan="2">
<label for="add_street" style="font-size:12px;vertical-align:middle;padding-left:2px;">Street</label></td>
<input name="add_street" type="text" style="vertical-align:middle" value="" size="35" maxlength="50"/>
</td>
</tr>
<tr>
<td>
<label for="add_city" style="font-size:12px;vertical-align:middle;padding-left:2px;">City</label><input name="add_city" type="text" style="vertical-align:middle" value="" size="35" maxlength="30"/>
</td>
<td>
<label for="add_state" style="font-size:12px;vertical-align:middle;padding-left:2px;">State</label><input name="add_state" type="text" style="vertical-align:middle" value="" size="5" maxlength="2"/>
</td>
</tr>
</table>
</form>

Hope this help !

[andrewliu]

thanks zero13, i'll see if i can fix around this to my liking.

right now each element is in a cell. the title and fields are right next to each other. then on the next row there's two more cells, title and then the field.. and so on.

So what I'm trying to do on one of the rows is have 6 cells. street then field (two separate cells), next to that city then field, and so on.

I might have to create a new table for this? I wanted it to line up nicely with my table.

thank you.

[andrewliu]

or is doing <ul><li> tags easier to work with?

[JRM]

If you want the label next to the input within the cell, then don't separate them with a td tag. Make it one big cell.

<tr><td>
<label for="add_street" style="font-size:12px;vertical-align:middle;padding-left:2px;">Street</label> <!--removed the cell separation. add padding as neeeded-->
<input name="add_street" type="text" style="vertical-align:middle" value="" size="35" maxlength="50"/>
</td></tr>

In fact, to further simplify this, put the vertical align style in the td and nix it in the others.