CSS 선택자 인접 형제 존재하는 경우

나는 다음 (간체) HTML 구조가CSS 선택자 인접 형제 존재하는 경우

<td> 
    <DIV class="t-numerictextbox"> 
     <DIV class="t-formatted-value">$0.00</DIV> 
     <INPUT id="MyObj_PropertyName class="t-input" name="MyObj.PropertyName"> 
    </DIV> 
    <SPAN class="field-validation-error" data-valmsg-for="MyObj.PropertyName">blah blah</SPAN> 
</td>

나는 IF 빨간색으로 부모 div.t - numerictextbox의 배경 색상을 설정 할 싶습니다 무엇 span 요소도 존재합니다. 인접 형제에 대해이 조건부 선택을 수행하는 CSS 구문은 무엇입니까?

내가 asp.net MVC 응용 프로그램을 가지고 있고 Telerik MVC NumericTextBox 컨트롤을 사용하고 있습니다 : 당신이 궁금하면

은 BTW, 나는이 IE 8

배경을 위해 일해야합니다. ModelState 유효성 검사 오류가 발생하면 MVC 프레임 워크는 요소에 class = "input-validation-error"속성을 자동으로 삽입하고 스타일 시트는이 클래스를 선택하여 요소를 빨간색으로 강조 표시합니다. 그러나 Telerik MVC 컨트롤 (Telerik의 javascript가이를 덮어 쓰기 때문이라고 가정)에서는 작동하지 않습니다.

감사합니다.

출처

2011-08-19 Raymond

http://stackoverflow.com/questions/29662009/css-select-element-only-if-a-later-sibling-exists에서 허용되는 답변은 아마도 여기에 수락 된 답변보다이 문제에 대한 더 나은 해결책 일 수 있습니다. IE8에서의 지원 요구 사항 이외. – Jules

[CSS : 추후 형제가있을 경우에만 요소 선택] 가능한 복제본 (http://stackoverflow.com/questions/29662009/css-select-element-only-if-a-later-sibling-exists) – Jules

div 앞에 span을 넣고 css로 배치 할 수 있습니다.

그런 다음 CSS 인접 형제 선택기를 사용하여 스팬에 인접한 div를 선택합니다.

마지막으로 span에 위치 절대 값을 입력하고 top:..px을 입력하여 div 아래에 가져옵니다.

그래서 다음과 같은 얻을 :

span + div { 
 
    background-color:red; 
 
}

<td> 
 
    <span class="field-validation-error" data-valmsg for="MyObj.PropertyName">blah blah</span> 
 
    <div class="t-numerictextbox"> 
 
    <div class="t-formatted-value">$0.00</div> 
 
    <input id="MyObj_PropertyName" class="t-input" name="MyObj.PropertyName"> 
 
    </div>   
 
</td>

출처

2011-08-19 19:56:17 vanErp

CSS는 그렇게하지 못할. div.t-numerictextbox가 존재한다면 범위를 지정할 수 있지만, 그 반대의 경우는 아닙니다. 이것은 CSS의 한계이지만, 절대로 바뀌지 않을 것입니다.

출처

2011-08-19 19:59:11 Gerben

CSS 선택자 인접 형제 존재하는 경우

답변

관련 문제