I'm currently working on a reservation form for my website with a 2-column layout. In one column, I have tables, and I've been trying to add a divider between the columns but haven't found a solution yet.
Despite researching ways to add a divider in the CSS code, I still can't get it to work properly.
Currently, I have placed the form in 'fieldset' mode with the following CSS layout:
<style>
fieldset{
background-color: #52854C;
font-family: Georgia;
color: white;
border: 2px black solid;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
-khtml-border-radius:15px;
border-radius: 15px;
-webkit-box-shadow:inset 1px 1px 2px #999;
-moz-box-shadow:inset 1px 1px 2px #999;
-khtml-box-shadow:inset 1px 1px 2px #999;
box-shadow:inset 1px 1px 2px #999;
}
</style>
This is the HTML Form structure:
<fieldset>
<p><label>Full Address:<input type="text" id="rtstreet" name="rtstreet" style="margin:5px; width:320px; height:15px"></label></p></center>
<table>
<td><label>Airport Name:</label><input type="text" id="airport" style="width:70px; height:15px">
<td><label>Airline Code/Name:</label><input type="text" id="airport" style="width:45px; height:15px">
<td><label>Flight #:</label><input type="text" id="airport" style="width:35px; height:15px">
</table>
</div>
<div style="float:right list-style:none;">
<ul li><h1 class="lead" style="font-weight:bold; color:black;list-style:none;">Drop-Off Information</h1></ul li>
<p><label>Full Address:<input type="text" id="rtstreet" name="rtstreet" style="margin:5px; width:320px; height:15px"></label></p></center>
<table>
<td><label>Airport Name:<input type="text" id="airport" style="width:70px; height:15px">
<td><label>Airline Code/Name:<input type="text" id="airport" style="width:45px; height:15px">
<td><label>Flight #:<input type="text" id="airport" style="width:35px; height:15px">
</table>
</div>
<br>
<br>
</br>
</br>
</fieldset>
If anyone has any advice or tips on how to solve this issue, I would greatly appreciate it!