div 태그에 CSS가 적용되지 않습니다.

Question

CSS 태그를 사용하지 않아 div 태그에 작은 문제가 있습니다.

Firefox 및 Chrome에서 요소를 검사하면 알 수 있습니다. div 태그가있는 html 요소 하나가 보이고 CSS가 제대로 적용됩니다. 그런 다음 다른 코드를 살펴보고 html 코드가 거의 동일하지만 CSS를 적용하지 않습니다. 여기

<tr> 
     <td class="style1"> 
      <label><div ID="Login">Login:</label> 
     </td> 
     <td> 
      <input class="login" id="loginpassword" type="text" name="username"  
maxlength="75"> 
      </div> 
     </td> 
    </tr> 

가 loginpassword ID에 대한 CSS의 :

여기

#loginpassword {width:150px;} 

코드의 제 2 HTML 코드입니다 외설 (하나를 여기에

작동 DIV 태그를 하나 개의 HTML 코드입니다 '이 t은 CSS) 적용 :

<tr> 
     <td class="style1"> 
      <label><div ID="Password">Password:</label> 
     </td> 
     <td> 
      <input class="login" id="loginpassword2" type="password" name="password" 
maxlength="75"> 
      </div> 
     </td> 
    </tr> 

을 그리고 여기 loginpassword2 ID에 대한 CSS의 :

#loginpassword2 {width:150px;} 

그래서 거의 동일하지만 loginpassword2의 ID는 CSS를 적용하지 않지만 loginpassword는 CSS를 적용합니다. 이상한. 나는 왜 하나가 작동하는지 다른 하나는 이해하지 못합니다.

실마리가 있습니까? 더 자세한 정보가 필요하면 알려주세요.

답장을 보내 주셔서 감사합니다.

Answer 1

에서 클래스 = "로그인"을 제거 : 정말 HTML을 형성한다

<td class="style1"> 
    <label><div ID="Login">Login:</label> 
</td> 
<td> 
    <input class="login" id="loginpassword" type="text" name="username" maxlength="75"> 
    </div> 

합니다. <td> 안에 <div> 태그를 열고 다른 <td> 내부를 닫을 수 없습니다.

는 HTML 유효성 검사 고려해 http://validator.w3.org/#validate_by_input+with_options

---

뿐만 아니라,하지만 당신은 또한 그 (것)들의 모두의 클래스 login를 사용하여, 그래서 당신은 그들에게 스타일링하고 있기 때문에, 그 이유를 활용하지 않는 같은?

.login {width:150px;} 

이는 login 클래스의 모든 요소에 영향을줍니다.

---

더 읽을 거리 :

CSS ID를 & 클래스 CSS ID vs Class에 그의 대답에

• 체크 아웃 조나단 샘슨의 예를.
• http://css-tricks.com/the-difference-between-id-and-class/

유효한 HTML

• http://www.leemunroe.com/how-important-is-valid-html-web-standards/

Answer 2

한 가지 작업을 수행하십시오. 그냥 우선 모두 입력 태그

Answer 3

은 클래스 레벨 대신 ID에 대한 CSS를 적용합니다.

#의 loginpassword2 {폭;

Answer 4

당신은

HTML

<table> 
<tr> 
<td class="style1"> 
<label id="lbllogin" runat="server">Login:</label> 
</td> 
<td> 
<input class="login" id="loginpassword" type="text" name="username"  
maxlength="75" /> 
</td> 
</tr> 
</table> 
<br> 
<table> 
<tr> 
<td class="style1"> 
<label id="lblpwd" runat="server">Password:</label> 
</td> 
<td> 
<input class="login" id="loginpassword2" type="password" name="password" 
maxlength="75" /> 
</td> 
</tr> 
</table> 

CSS

#loginpassword {150 픽셀 폭}처럼 HTML 레이아웃을 변경할 수 있습니다 : 150px;}

희망이 있습니다.