CSS 그리드 컨테이너 내에 손자를 배치하려면 어떻게 해야 합니까?

그리드 컨테이너의 손자

CSS 그리드 가이드는 그리드에 위치한 요소가 그리드 요소의 직계 하위 요소임을 제안합니다. 하지만 그리드의 "손자"인 요소를 배치하려면 어떻게 해야 할까요?

display: subgrid

CSS Grid Level 2 초안 사양에서는 서브그리드의 개념 display: subgrid를 사용하면 그리드 항목의 행과 열 정의를 상위 그리드 컨테이너로 연기할 수 있습니다. 이렇게 하면 두 그리드의 내용을 정렬할 수 있습니다.

그러나 이 기능은 아직 주요 브라우저에 구현되지 않았습니다.

기타 옵션

그리드 수준 1에서는 컨테이너의 유입 하위 항목만 그리드 항목이 됩니다. 디스플레이: 그리드 항목의 하위 그리드를 사용하면 항목의 하위 항목이 컨테이너의 줄을 따릅니다.

또는 그리드 항목의 디스플레이: 그리드(중첩 그리드 컨테이너)를 사용하거나 디스플레이: 콘텐츠 해결 방법을 탐색할 수 있습니다. "CSS의 대안은 무엇입니까?"에 설명되어 있습니다. subgrid?"

리소스

• [하위 그리드](https://blogs.igalia.com/mrego/2016/02/12/subgrids -소리내어 생각하기/)
• [Mozilla Bugzilla](https://bugzilla.mozilla.org/show_bug.cgi?id=1240834)

위 내용은 CSS 그리드 컨테이너 내에 손자를 배치하려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!