2013-08-20 2 views
2

텍스트 필드 입력을 정렬하고 싶습니다. 현재는 다음과 같습니다 : 나는 그것을 중심을 수있는 방법을 찾을 수 없습니다CSS 텍스트 필드 입력을 맞 춥니 다

http://2.imgland.net/Fk7zSx.png

.

.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; 
} 

그래서, 내가 중심을 수있는 방법을 찾을 수 없습니다

여기 내 로그인 CSS입니다. 또한 필요한 경우 여기에 내 로그인 양식이 있습니다.

<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> 

어쨌든 정렬 할 수 있습니까? 나는 여러 가지 일을 시도했지만 그들 중 누구도 실제로 일하지 않았습니다.

+2

정렬 상대적으로 CSS를 text-align: center; 추가; (중앙 정렬) 는 다음 정의를? 형태의 중심? 당신이 정교 할 수 있니? – hexblot

+0

jsFiddle -> http://jsfiddle.net/ 좋은 것입니다 :) –

답변

4

클래스 로그인 체크 무슨이 fiddle

+0

덕분에, 그냥 다른 질문을, 어떻게 양식을 만들 수 있습니까 (센터링없이) 비트? –

+0

전체 양식? 그렇다면 약간의 여백을 남겨주세요. –

0

스타일 시트에 div를 사용하면 center를 정렬하고 싶을뿐입니다 (clear : both;).

관련 문제