body{

 display: gird;

grid-template-columns: repeat(3,1fr);

}

body div:nth-child(3){

   display: grid;

grid-template-columns: repeat(3,1fr);

grid-template-rows: repeat(2,1fr);

}

후 3번째 자식의 자식들에게 사진을 넣으면 이상한 현상이 일어납니다

window의 크기가 작을때는 설정한 대로 화면에 보이는데 윈도우 크기를 키우면 형제들의 포지션을 침범하게 되네요

--윈도우 작을때--

--윈도우 키울 시--