我大学任务的网站,
我在JavaScript中为我的网站创建了一个表单,我需要对齐不同的输入框,并且我正在努力解决这个问题。
这是我已经拥有的代码以及我所包含的CSS类。
.booking1 {
position: relative;
float: left;
padding: 0px;
}
.booking2 {
position: relative;
float: right;
padding-top: 10px;
padding-left: 200px;
}

<table>
<th scope="col" class="booking1">
<div class="form">
<form method="post" action="mailto:joshua.harvey2@stu.mmu.ac.uk" name="ContactForm" onsubmit="return ValidateContactForm();">
<p>Name: <input type="text" size="35" name="Name"></p>
<p>E-mail Address: <input type="text" size="35" name="Email"></p>
<p>Telephone: <input type="text" size="35" name="Telephone"><br>
<input type="checkbox" name="DoNotCall" onclick="EnableDisable(this);"> Please do not call me.</p>
<p>Date of Birth: <input type="text" size="35" name="DateofBirth"></p>
<p>RoomType
<select type="text" value="" name="RoomType">
<option> </option>
<option>Single</option>
<option>Twin</option>
<option>Double</option>
<option>Triple</option>
<option>Family</option>
</select></p>
<p>Date of Arrival: <input type="text" size="35" name="DateofArrival"></p>
<p>Check Out Date: <input type="text" size="35" name="CheckOutDate"></p>
<p>Number Of Guests
<select type="text" value="" name="RoomType">
<option> </option>
<option> 1 </option>
<option> 2 </option>
<option> 3 </option>
<option> 4 </option>
</select></p>
<p><input type="submit" value="Send" name="submit">
<input type="reset" value="Reset" name="reset"></p>
</form>
</div>
</th>
<th scope="col" class="booking2">
<div class="Login">
<form method="post">
<p>Username: <input type="text" size="65" name="username"></p>
<p>Password: <input type="text" size="65" name="password"></p>
<p><input type="submit" value="Send" name="submit">
<input type="reset" value="Reset" name="reset"></p>
</form>
</div>
</th>
</table>
</body>
<!-- Footer Start -->
<br />
<table class="footer">
<th scope="col" class="socialmedia1">Social Media Links</th>
<th scope="col" class="copyright">© Hotel Verdene 2017</th>
<th scope="col" class="socialmedia2">Social Media Links</th>
</table>
&#13;