Html 格式化网站设计

下面的代码显示表单的上方和谷歌地图的下方。我应该如何编辑代码以在同一行中显示网页左侧的表单和右侧的谷歌地图

<form action="php/process.php" method="post" enctype="multipart/form-data">
    <p>
        Subject<br>
        <input type="text" name="subject" size="40">
    </p>
    <p>
        Email<br>
        <input type="text" name="email" size="40">
    <p>
        Comment<br>
        <textarea name="message" rows="5" cols="40"></textarea>
    </p>
    <p>
        <button type="submit">Send</button>
    </p>
</form>

</div>
<!--contact form ends-->

<!--google map starts-->
<h2 align="right">
&nbsp;&nbsp;&nbsp;&nbsp;
<iframe width="400" height="250" frameborder="1" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.com/maps/ms?msa=0&amp;msid=202307324044817298386.0004b64eed9ece46b338e&amp;ie=UTF8&amp;t=h&amp;z=17&amp;output=embed"></iframe>
<br /><small>
<h2>View <a href="https://maps.google.com/maps/ms?msa=0&amp;msid=202307324044817298386.0004b64eed9ece46b338e&amp;ie=UTF8&amp;t=h&amp;z=17&amp;source=embed" style="color:#0000FF;text-align:left">KsV's HoMe</a> in a larger map</small></h2>
<!--gogle map ends-->

主题



电子邮件


评论



发送



在更大的地图中查看

您可以这样做：

div id=“box”将两者都包装起来，因此可以说是您的“行” div id=“formleft”将窗体向左浮动，div id=“mapright”将贴图向右浮动

<div id="box" style="position:relative;height:250px;width:820px;margin:0;padding:0;">
<div id="formleft" style="position:relative;float:left;width:400px;height:250px">
<form action="php/process.php" method="post" enctype="multipart/form-data">
<p>
  Subject<br>
<input type="text" name="subject" size="40">
</p>
<p>
Email<br>
<input type="text" name="email" size="40">
<p>
Comment<br>
<textarea name="message" rows="5" cols="40"></textarea>
</p>
<p>
<button type="submit">Send</button>
</p>


 </form>

</div>
<!--contact form ends-->
<div id="mapright" style="position:relative;float:right;width:400px;height:250px">
<!--google map starts--><h2 align="right">
&nbsp;&nbsp;&nbsp;&nbsp;     <iframe width="400" height="250" frameborder="1"        scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.com/maps/ms?msa=0&amp;msid=202307324044817298386.0004b64eed9ece46b338e&amp;ie=UTF8&amp;t=h&amp;z=17&amp;output=embed">    </iframe><br /><small><h2>View <a href="https://maps.google.com/maps/ms?msa=0&amp;msid=202307324044817298386.0004b64eed9ece46b338e&amp;ie=UTF8&amp;t=h&amp;z=17&amp;source=embed" style="color:#0000FF;text-align:left">KsV's HoMe</a> in a larger map</small></h2>
<!--gogle map ends-->
</div>
</div>

主题



电子邮件


评论



发送


在更大的地图中查看