IE8을 사용하는 첫 번째 자식 및 마지막 자식
내 테이블에서 조정하는 데 필요한 CSS가 있습니다.
여기있어:
.editor td:first-child
{
width: 150px;
}
.editor td:last-child input,
.editor td:last-child textarea
{
width: 500px;
padding: 3px 5px 5px 5px;
border: 1px solid #CCC;
}
Firefox, Safari 및 Chrome에서는 작동하지만 IE8에서는 작동하지 않습니다.
나는 문제가 첫 자녀와 막내 자녀에게서 비롯된다는 것을 알고 있지만 전문가는 아닙니다.
내가 어떻게 고칠 수 있는지 아십니까?
추신 : <!doctype html>내 html 문서 위에 추가 했지만 아무것도 변경되지 않았습니다.
테이블이 2 열에 불과한 경우 tdIE8이 다음과 함께 지원하는 인접한 형제 선택기를 사용하여 두 번째 열에 쉽게 도달 할 수 있습니다 :first-child.
.editor td:first-child
{
width: 150px;
}
.editor td:first-child + td input,
.editor td:first-child + td textarea
{
width: 500px;
padding: 3px 5px 5px 5px;
border: 1px solid #CCC;
}
그렇지 않으면, 당신은 jQuery를 같은 JS 선택 라이브러리를 사용하거나 수동으로 마지막에 클래스를 추가해야합니다 td, 제임스 Allardice에 의해 제안 .
이후 :last-childCSS3 의사 클래스, 그것은 IE8에서 지원되지 않습니다. :first-childCSS2.1 사양에 정의되어 있으므로 지원 한다고 생각 합니다.
한 가지 가능한 해결책은 단순히 마지막 자식에게 클래스 이름과 스타일을 지정하는 것입니다.
또 다른 방법은 JavaScript를 사용하는 것입니다. jQuery는 :last-childIE8에서 작동해야하는 의사 클래스를 제공하므로이를 특히 쉽게 만듭니다 . 안타깝게도 DOM이로드되는 동안 스타일이 지정되지 않은 콘텐츠가 깜박일 수 있습니다.
당신은 CSS3 선택자하지만 같은 내가 polyfill을 사용하는 것이 좋습니다 것 이전 버전의 브라우저를 지원해야 사용에 대한 수행하려면 Selectivizr.js을
참고 URL : https://stackoverflow.com/questions/8840802/first-child-and-last-child-with-ie8
'Development Tip' 카테고리의 다른 글
| 어떤 키 / 값 저장소가 가장 유망하고 안정적인가요? (0) | 2020.12.04 |
|---|---|
| 테이블의 모든 열과 ROWNUM과 같은 추가 열을 어떻게 선택합니까? (0) | 2020.12.04 |
| 504 시간 초과 오류 증가 (0) | 2020.12.04 |
| WebApi에서 HttpContext.Current를 사용하는 것은 비동기로 인해 위험합니다. (0) | 2020.12.04 |
| docker를 사용할 때 virtualenv가 (프로덕션에서) 목적을 제공합니까? (0) | 2020.12.04 |