# WebKit, CSS Nesting 지원 시작

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

## Metadata

- GeekNews HTML: [https://news.hada.io/topic?id=8498](https://news.hada.io/topic?id=8498)
- GeekNews Markdown: [https://news.hada.io/topic/8498.md](https://news.hada.io/topic/8498.md)
- Type: news
- Author: [xguru](https://news.hada.io/@xguru)
- Published: 2023-02-17T10:48:25+09:00
- Updated: 2023-02-17T10:48:25+09:00
- Original source: [webkit.org](https://webkit.org/blog/13813/try-css-nesting-today-in-safari-technology-preview/)
- Points: 6
- Comments: 1

## Topic Body

- 작년 여름에 CSSWG에서 투표를 진행해서 옵션3 이었던 "브라켓 표기" 방식이 승리   
- 이에 사파리/크롬이 옵션3을 구현했고, 1/25에 릴리즈된 사파리 기술 프리뷰 162 버전부터 적용   
```css  
.foo {  
  color: green;  
 .bar {  
    font-size: 1.4rem;  
  }  
}  
```  
- 브라우저 파싱 엔진의 제한으로 내부의 셀렉터(위의 `.bar`)는 무조건 기호로 시작해야함 `. # : [ * + > ~`  
→ 즉 `main { article {...} }` 은 불가능함 `main { & article {...} }` 형태로 표시해야함

## Comments



### Comment 14852

- Author: xguru
- Created: 2023-02-17T10:48:46+09:00
- Points: 1

[W3C, CSS Nesting Module 초안 공개](https://news.hada.io/topic?id=4937)  
[CSS Nesting 문법 선택에 투표해 주세요](https://news.hada.io/topic?id=7062)  
[2022년 주목해야 할 CSS 기능들](https://news.hada.io/topic?id=6076)