我想将表单中的元素居中而不移动文本或按钮在左侧对齐。
所以它看起来像这样:
底部方块应该是一个按钮。
我希望它居中,但<center>
标签移动文本和按钮,使它们居中于输入框。
这是我的代码:
<form action="login.php" method="post">
<div class="aside">
<div id="center">
Username:<br>
<input type="text" name="username"><br>
Password:<br>
<input type="password" name="passwor"><br>
<input type="submit" class="button" name="submit" value="Login"><br><br>
</div>
</div>
</form>
和CSS:
#center{
width: 250px;
margin-left: auto;
margin-right: auto;
}
div.aside {
margin-left: 15px;
margin-top: 10px;
width: 250px;
background: #f5f5f5;
border: 1px solid #e9e9e9;
line-height: 150%;
}
div.aside .button{
padding:3px;
width: 50px;
margin-top: 3px;
background-color: #00A1E6;
border: 1px solid #0184BC;
text-decoration:none;
color: #ffffff;
text-align: center;
-webkit-appearance: none;
}