[Dojo-interest] How do I override a widget CSS class?

Sol Kindle kindsol at hotpop.com
Wed Apr 26 08:46:28 MDT 2006


Good question.  I override the default styles by incresing the CSS rule 
specificity.

The CSS rule from tree.css is :

.dojoTree {
    font: caption;
    font-size: 11px;
    font-weight: normal;
    overflow: auto;
}

If you look at the tree template string (in tree.js) you will see that 
the entire tree widget is contained in <div /> tags:

 <div class="dojoTree"></div>

I would override with my own CSS file by defining:

div.dojoTree {
    font:/ myfont/;
}

By adding the 'div' to the front of the rule, I have increased 
specificity and my custom rule wins.

DISCLAIMER: I did not actually try this example -- but hopefully you get 
the idea.

-Sol


Bernie Durfee wrote:
> Is this possible? Do I need to create a 'theme' or is there a way to 
> just override the font of the tree?
>
> Bernie Durfee wrote:
>> I'd like to change the font of the Tree widget, what the easiest way?
>>

-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://dojotoolkit.org/pipermail/dojo-interest/attachments/20060426/ea0955e1/attachment.html


More information about the Dojo-interest mailing list