テキストフィールドの入力を揃えたい。現在、次のようになっています。
http://2.imgland.net/Fk7zSx.png
私はそれを中心にする方法を見つけることができません。
これが私のログインcssです：
.login{
background:url(../images/footer.png) bottom left repeat-x;
width:330px;
text-shadow: 0px 2px 3px rgba(0, 0, 0, 1);
font-family:'Oswald', Helvetica, Arial, sans-serif;
color:#fff;
font-size:13px;
font-weight:700;
text-transform:uppercase;
padding:0px 0px 16px 0px;
margin:0px 0px 10px 1px;
float:left;
vertical-align:top;
}
また、私のテキストフィールド入力とテキストエリアcss:
/* Forms */
textarea, input {
color: #666;
padding: 5px;
border: solid 1px #E5E5E5;
background: url(../images/textfield.png) 0 0 repeat-x white;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
transition: all 0.35s ease-in-out;
-moz-transition: all 0.35s ease-in-out;
-webkit-transition: all 0.35s ease-in-out;
-o-transition: all 0.35s ease-in-out;
width:220px;
}
textarea:focus, input:focus {
outline:none;
}
textarea:hover, input:hover, textarea:active, input:active {
border:1px solid #2ac0ff;
transition: all 0.35s ease-in-out;
-moz-transition: all 0.35s ease-in-out;
-webkit-transition: all 0.35s ease-in-out;
-o-transition: all 0.35s ease-in-out;
}
textarea {
background: url(../images/textarea.png) 0 0 repeat-x white;
height:152px;
}
だから、私はそれを中心にする方法を見つけることができません。また、必要に応じて、HTML のログイン フォームを以下に示します。
<div class="login">
<div class="header">Login / Register</div>
<form action="login.php" method="post">
<li>
Username: <br>
<input type="text" name="username">
</li>
<li>
Password: <br>
<input type="password" name="password">
</li>
<li>
<input type="submit" value="Log in">
</li>
<?php
/* Form file */
Token::create();
?>
<center> <h3><a href="register.php">New account</a></h3>
<font size="1">- Lost <a href="recovery.php?mode=username">username</a> or <a href="recovery.php?mode=password">password</a>?</font></center>
</form>
</div>
とにかくそれを整列させることはありますか？私はいくつかのことを試しましたが、どれも実際にはうまくいきませんでした。