CSS 그룹화가 잘못 되었습니까?

Question

왜, 당신은 완전히 그들을 선언해야

.right, .left .box_header { 
margin: -10px -1.2% 10px -1.2%; 
padding: 5px 0.5% 5px 0.5%; 
} 

당신이 그룹 여러 선택기를 원한다면 나는 (인)가 할

.right .box_header { 
margin: -10px -1.2% 10px -1.2%; 
padding: 5px 0.5% 5px 0.5%; 
} 

.left .box_header { 
margin: -10px -1.2% 10px -1.2%; 
padding: 5px 0.5% 5px 0.5%; 
} 

Answer 1

을 기대하는 것을하지 않습니다 :

.right .box_header, .left .box_header { 
margin: -10px -1.2% 10px -1.2%; 
padding: 5px 0.5% 5px 0.5%; 
} 

,을 사용하여 하위 패턴을 그룹화 할 수 없습니다. W3C CSS2 selectors recommendation 또는 W3C CSS3 selectors recommendation을 참조하십시오.

Answer 2

첫 번째 코드에서 두 가지 다른 선택을 선언했기 때문입니다.

i) 클래스 선택기 (.right) 클래스 'right'가 붙은 모든 요소의 스타일을 지정합니다.

II) 상위 하위 선택기 (.left .box_header) 이 스타일 클래스의 요소의 후손 반드시 클래스 'box_header'의 요소가 부착 '왼쪽'.

두 번째 코드에서 명시 적으로

i)는 조상의 후손 선택기 (됐지 .box_header)에 대한 그것은 스타일 바로 '클래스의 요소의 후손해야 클래스의 box_header'의 요소를 스타일을 선언하면서 '첨부.

그리고 정확하게 두 스타일을 선언하는 당신은 코드

.right .box_header, .left .box_header { 
/* Styles here*/ 
} 

II) 조상 자손 셀렉터 (.left .box_header) 자손되어야합니다 클래스의 box_header '의 II) 그것은 스타일 모든 요소를 ​​사용할 수 있습니다 클래스 'right'요소의.

그 이유는 두 코드가 다른 효과가 있기 때문입니다.