Css 클래스가 텍스트 상자의 테두리 색상을 변경하지 않습니다.

Question

ASP.NET MVC 3 및 ​​FluentValidation을 사용하여 내 뷰 모델의 유효성을 검사하고 있습니다.

나는 현재 내 텍스트 상자는 다음과 같이 스타일이 있습니다

input[type="text"]{border:1px solid #c9d7e1;padding-left:2px;} 

와 입력에 오류가있는 경우에 대해 내가 발리 CSS의 클래스가 : 다음에

.input-validation-error{border:1px solid #ff0000;background-color:#ffeeee;} 

검증 차기 텍스트 상자의 배경색은 #ffeeee가 맞지만 텍스트 상자의 테두리를 빨간색으로 만들지 않습니다 (# ff0000). 여전히 # c9d7e1입니다. 텍스트 상자의 테두리가 빨간색이되도록 스타일을 어떻게 변경합니까?

나는 또한 나의 텍스트 영역과 같이 정의했다 :

textarea{border:1px solid #c9d7e1;padding-left:2px;} 

과 경계가 빨간색으로 설정됩니다.

Answer 1

input[type="text"]은 more specific이므로 .input-validation-error이므로 우선합니다.

input[type="text"].input-validation-error{ 
    border:1px solid #ff0000; 
    background-color:#ffeeee; 
} 

이 작업을 수행합니다.