将表单向右对齐

Question

我想将这两个表单向右对齐，因为我在左侧有一张地图，而我不希望这些表单出现在页面的底部。我不是很擅长css。有人能告诉我怎样才能把这两种形式对准吗？提前致谢。

<h2> Save Animal's Location </h2> 
<form action="insert.php" method="post"> 
Animal Type: <input type="text" name="firstname"> 
latitude: <input type ="text" name="lat" > 
longitude <input type ="text" name="lon"> 
Date: <input type="date" name="dateseen"> 
Time: <input type="time" name="timeseen"> 


<br> 
<input type="submit"> 
</form> 

<h2> Search </h2> 
<form action = "search.php" method = "post" > 
    Search for: <input type = "text" name ="find" /> in 
    <select NAME = "field"> 
    <Option VALUE = "Animal Type"> Animal Type</option> 
    <Option VALUE = "latitude"> Latitude</option> 
    <Option VALUE = "longitude"> longitude</option> 
    <Option VALUE = "dateseen"> Date Required</option> 
    <Option VALUE = "timeseen"> Time</option> 
    </Select> 
    <input type= "hidden" name = "searching" value ="yes"/> 
    <input type= "submit" name = "search" value ="Search"/> 
</form> 

Answer 1

这里有一个解决方案：http://jsfiddle.net/panchroma/e92A5/1/

在CSS，宽度值打得到你需要的结果。您可以使用％值，如下所示，或者您可以使用像素值，例如480px

祝你好运！

编辑

使用的地图信息，请参阅更新的解决方案：

http://jsfiddle.net/panchroma/e92A5/

HTML

<div class="left"> 
map here 
</div> 

<div class= "right"> 

    <h2> Save Animal's Location </h2> 
<form action="insert.php" method="post"> 
Animal Type: <input type="text" name="firstname"> 
latitude: <input type ="text" name="lat" > 
longitude <input type ="text" name="lon"> 
Date: <input type="date" name="dateseen"> 
Time: <input type="time" name="timeseen"> 


<br> 
<input type="submit"> 
</form> 



<h2> Search </h2> 
<form action = "search.php" method = "post" > 
Search for: <input type = "text" name ="find" /> in 
<select NAME = "field"> 
<Option VALUE = "Animal Type"> Animal Type</option> 
<Option VALUE = "latitude"> Latitude</option> 
<Option VALUE = "longitude"> longitude</option> 
<Option VALUE = "dateseen"> Date Required</option> 
<Option VALUE = "timeseen"> Time</option> 
</Select> 
<input type= "hidden" name = "searching" value ="yes"/> 
<input type= "submit" name = "search" value ="Search"/> 
</form> 
</div> 

CSS

.left{ 
float:left; 
width:50%; 
background-color:pink; 
} 
.right{ 
float:right; 
width:50%; 
background-color:#ddd; 
}