在一个HTML文件中显示两个表格

Question

我想更改我的网站的登录页面。

我需要在登录页面上添加一个注册表单，这样该页面将有两种形式：一种用于登录，另一种用于注册。

我不知道如何水平设置这些形式。任何人都可以解释如何做到这一点？

Answer 1

你需要做什么这应该给你的一个想法：

HTML：

<div class="container"> 
    <div class="form form1">Form 1</div> 
    <div class="form form2">Form 2</div> 
</div> 

CSS：

.container { 
    width:100%; 
    overflow:auto; 
} 

.form { 
    width:50%; 
    height:100px; 
    float:left; 
} 

.form1 { 
    background:#ccc; 
} 

.form2 { 
    background:#999; 
} 

现场演示：​​

Answer 2

使用float:left：

HTML：

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

CSS：

input { display: block; } 
form { float: left; padding-left: 15px; } 

现场演示：Tinkerbin

Answer 3

你有可能把这些表单放入div中吗？

HTML：

<div class="left">LEFT FORM</div> 
<div class="right">RIGHT FORM</div> 
<div class="clear"></div> 

CSS：

.left { 
    float:left; 
    width:300px; 
} 
.right { 
    width:300px; 
} 
.clear { 
    clear:left; 
}