TECH NOTES
기술노트
현장에서 검증된 개발 지식을 기록합니다.
21
Frontend
모바일 CSS가 안 먹던 이유 — @media 위치와 캐스케이드 소스 순서, 인라인 스타일 함정
미디어쿼리는 명시도를 올려 주지 않아서, 같은 선택자라면 뒤에 나온 기본 규칙이 모바일 규칙을 덮는다. 목록 페이지 모바일 리디자인에서 겪은 소스 순서·인라인 스타일 문제와 해결법을 정리했다.
Frontend
CSS 컨테이너 쿼리와 :has() — 미디어쿼리로는 못 풀던 반응형을 컴포넌트 단위로
뷰포트 미디어쿼리의 한계를 @container 컨테이너 쿼리와 :has() 부모 선택자로 넘어서는 실전 패턴을 정리했다. 컴포넌트 단위 반응형을 실현하는 실제 CSS 코드, cqi 단위, 마이그레이션 함정, 2025년 브라우저 지원까지 한 번에 다룬다.