None of these work:
.download .dijitTitlePane .dijitClosed .dijitArrowNode {
background-position: 3px 0;
background-image: url("image/download.png");
height: 11px;
// change with your image dimensions width: 11.5px;
// change with your image dimensions
}
.download .dijitTitlePane .dijitOpen .dijitArrowNode {
background-position: 3px 0;
}
.download .dijitTitlePane .dijitArrowNode {
background-image: url("image/download.png") !important;
background-repeat: no-repeat;
height: 11px !important;
// change with your image dimensions width: 11.5px;
// change with your image dimensions
}
.download .dijitTitlePane .dijitArrowNode, .claro .dijitFieldset .dijitArrowNode {
width: 12.5px !important;
}
It goes back to the regular arrownode when I replace claro with my class.
These work:
.download .dijitTitlePaneTitle {
padding: 0 0 3px 5px;
background-color: white;
border-radius: 2px;
border: 1px solid black;
width: 30px;
height: 30px;
}
.download .dijitTitlePaneContentInner {
border: 1px solid black;
margin-top: 7px;
}