codeSeven codeSeven - 6 months ago 15
HTML Question

multiple columns in body

Hi I have a form which I want to make 5 forms below in 5 columns in the body. I know that it is possible. Can you please help me ?

----------------------------------------------------
| | | |
| Column 1 | Column 2 | Column 3 |
| | | |
----------------------------------------------------



<table cellspacing="10">

<tr>
<td><font color="black">*</font>Ref. No: </td>
<td><input type="text" onkeypress="return numeric(event); "value="<?PHP if(isset($_POST['code'])) echo htmlspecialchars($_POST['code']);?>" name="code" ></td>
</tr>

<tr>
<td><font color="black">*</font>Serial No: </td>
<td><input type="text" value="<?PHP if(isset($_POST['serialnumber'])) echo htmlspecialchars($_POST['serialnumber']);?>" name="serialnumber"><br></td>
</tr>


<tr>
<td><font color="black">*</font>Item Model: </td>
<td><input type="text" value="<?PHP if(isset($_POST['model'])) echo htmlspecialchars($_POST['model']);?>" name="model"></td>
</tr>

<tr>
<td><font color="black">*</font>Description </td>
<td> <input type="text" value="<?PHP if(isset($_POST['description'])) echo htmlspecialchars($_POST['description']);?>" name="description"><br></td>
</tr>

</table>

Answer

A solution to your problem, while using tables, is to put all the labels in the first row, and all the inputs in the second.

http://codepen.io/anon/pen/pyXgyW

<table cellspacing="10">
<tr>
<td><font color="black">*</font>Ref. No: </td>
<td><font color="black">*</font>Serial No: </td>
<td><font color="black">*</font>Item Model: </td>
<td><font color="black">*</font>Description </td>
</tr>

<tr>
<td><input type="text"  onkeypress="return numeric(event); "value="<?PHP if(isset($_POST['code'])) echo htmlspecialchars($_POST['code']);?>" name="code" ></td>
<td><input type="text"  value="<?PHP if(isset($_POST['serialnumber'])) echo htmlspecialchars($_POST['serialnumber']);?>" name="serialnumber"><br></td>
<td><input type="text"  value="<?PHP if(isset($_POST['model'])) echo htmlspecialchars($_POST['model']);?>" name="model"></td>
<td> <input type="text"  value="<?PHP if(isset($_POST['description'])) echo htmlspecialchars($_POST['description']);?>" name="description"><br></td>
</tr>


</table>

Expanding on this, you could nest your form table inside another four or five column table, like this: http://codepen.io/anon/pen/pyXgyW

Comments