css display: grid, aspect-ratio 사용 시 li의 크기가 ul의 가로 너비를 넘어갈 때

ul { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }

li { width: 100% }

 

#gall_ul {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr)); /* 각 열의 최소 크기를 0, 최대 크기는 1fr로 설정 */
    gap: 54px 26px;
}

#gall_ul .list {
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    aspect-ratio: 1 / 1;
    background-color: #fff;
    width: 100%; /* 가로폭을 부모에 맞게 */
}