텍스트의 스타일을 지정하지 않고 Dojo 버튼의 크기를 변경하려면 어떻게해야합니까?

Question

Dojo와 CSS에 익숙하지 않으므로 여기서 분명히 분명한 것을 놓치고있을 것입니다.

프로그래밍 방식으로 생성 된 여러 개의 Dijit 버튼이있는 페이지가 있으며, 그 중 하나를 더 크게 만들고 텍스트를 그대로두고 텍스트와 버튼 가장자리 사이의 간격을 늘리고 싶습니다.에 대한 CSS를 덮어 쓰지 않으려면 변경해서는 안되는 다른 Dijit 버튼이 있기 때문입니다.

style: { padding: "1em" } 

이 :

I 위젯 선언이 추가 시도

class: "PaddedButton" 

.PaddedButton 
{ 
    padding: 1em; 
} 

을하지만 인 Dijit 버튼 중첩으로 렌더링되기 때문에 대신 버튼 주변 패딩 걸쳐.

Answer 1

CSS를 사용하는 가장 좋은 방법은 Firebug 또는 Chrome 개발자 도구와 같은 브라우저 디버깅 도구 중 하나를 사용하는 것입니다. inspect_element를 사용하여 요소의 DOM 노드를 쉽게 찾은 다음 원하는대로 수행 할 때까지 CSS 스타일을 직접 편집 할 수 있습니다. 활성화 된 CSS 규칙과 무시되거나 덮어 쓰여지는 내용을 볼 수도 있습니다.

여기 작업 예제와 함께 올라와있다 : http://jsfiddle.net/missingno/FrYdx/2/

중요한 부분을 다음과 같은 CSS 선택기입니다 : 이것은이 노드의 하위 클래스 dijitButtonNode있는 모든 노드를 선택

.paddedButton.dijitButton .dijitButtonNode { 
    padding: 1em; 
} 

은 paddedButton 클래스와 dijitButton 클래스의 양쪽 모두 나는 .paddedButton .dijitButtonNode을 할 수 없었습니다. 그 이유는 규칙이 더 구체적인 선택자에 의해 계단식으로 연결될 것이기 때문이었습니다.