HTML 텍스트와 암호 입력 필드는 차이가 크기 인터넷 익스플로러

Question

내 로그인 양식이 양식 설정을 사용하고 있습니다

<tr> 
    <td class="label"> Username:</td> 
    <td> <input id="id_username" type="text" name="username" maxlength="30" /></td> 
</tr> 
<tr> 
    <td class="label"> Password:</td> 
    <td> <input a="text" type="password" name="password" id="id_password" /></td> 
</tr> 

파이어 폭스에 동일한 크기의 두 입력 상자를 사용하여. 그러나 내가 IE 9에있을 때 암호 필드는 더 작습니다.

이 동작을 제거하는 가장 좋은 방법은 무엇입니까?

Answer 1

사용 CSS는 예를 들어 소자에 고정 width 값을 적용하려면

.fixed-input { 
    width: 150px; 
} 
.... 
<input class="fixed-input" id="id_username" type="text" name="username" maxlength="30" /> 

Answer 2

가장 좋은 방법은이 요소의 스타일을 정의하고 적절한 너비를 설정하는 것입니다. maxlength 속성은 사용자 필드의 크기를 증가시킬 수 있습니다.

Answer 3

내가 같은 문제가 있었다. 나는 너비 스타일을 추가했고 그들은 여전히 ​​다르게 보였다.

텍스트와 비밀번호 입력에 대해 채우기와 테두리 색상이 동일하지 않은 것으로 나타났습니다.

width: 200px; 
font-family: sans-serif; 
font-size: 15px; 
padding: 3px; 
border: 1px solid black;