# CSS 미디어 쿼리는 가고 컨테이너 쿼리가 온다

> Clean Markdown view of GeekNews topic #5112. Use the original source for factual precision when an external source URL is present.

## Metadata

- GeekNews HTML: [https://news.hada.io/topic?id=5112](https://news.hada.io/topic?id=5112)
- GeekNews Markdown: [https://news.hada.io/topic/5112.md](https://news.hada.io/topic/5112.md)
- Type: news
- Author: [xguru](https://news.hada.io/@xguru)
- Published: 2021-10-01T09:20:23+09:00
- Updated: 2021-10-01T09:20:23+09:00
- Original source: [tomquinonero.com](https://tomquinonero.com/blog/a-guide-to-css-container-queries/)
- Points: 6
- Comments: 1

## Topic Body

- 반응형 페이지 만들때 스크린 사이즈가 아닌 컨테이너의 사이즈에 따라 변경하는 방식

- 아직 스펙 초기 단계

- 크롬에서는 플래그 설정시에만 지원되지만, CQFill 폴리필로 모든 브라우저에서 미리 적용 가능

@container (min-width: 600px) {

ㅤ.card {

ㅤㅤdisplay: flex;

ㅤ}

}

## Comments



### Comment 7085

- Author: xguru
- Created: 2021-10-01T09:20:26+09:00
- Points: 1

https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Container_Queries