CSS Container Queries 이제 다 써도 되나요? IE 같은 거 안 봐도 되죠?

Question

커뮤니티에서 Container Queries가 표준이다 라는 글들이 자주 보이는데요, 우리 회사는 보수적이라 신기능 도입 전에 항상 호환성을 따집니다. 2026년 5월 기준으로 진짜 다 받쳐주는 거 맞나요? 그리고 fallback은 어떻게 해야 하나요?

김영삼 · Accepted Answer

2026년 5월 기준 글로벌 점유율 99.5%, 한국은 99.7% 입니다. 이제 fallback 없이 그냥 써도 됩니다.

브라우저지원 시작2026 한국 점유Chrome 105+2022-08~63%Safari 16+2022-09~28%Edge 105+2022-08~6%Firefox 110+2023-02~2%Samsung Internet 21+2023~1%

IE: 2022년에 공식 지원 종료. 한국 공공·금융권도 작년에 거의 다 빠졌습니다. 만에 하나 회사 환경에서 IE를 봐야 한다면 그건 Container Queries 이전에 먼저 해결할 큰 이슈입니다.

fallback이 굳이 필요하다면:

.card { padding: 16px } /* 모든 환경 기본값 */

@supports (container-type: inline-size) {
  .card-wrapper { container-type: inline-size }
  @container (min-width: 480px) {
    .card { padding: 32px }
  }
}

이런 식으로 @supports로 감싸면 미지원 브라우저는 기본값만 보고, 지원 브라우저는 컨테이너 분기를 받습니다. 다만 99.5% 환경에서 굳이 이 코드 분기를 둘 가치가 있는지는 한 번 더 생각해보세요. 코드 부담만 늘어납니다.

댓글 1