How to override ComboBox Embedded CSS

[Michael Thornton]

I've read all the documents which I've been linked to but I have not come up with the correct syntax yet on how to do this.  I am using ASP.Net AJAX 3rd Quarter 2009 suite and I'm trying to override the text of the default embedded CSS for the combobox.  I look at the default skin for ComboBox and the styles I want to override are as follows:

.RadComboBox_Default,
.RadComboBox_Default .rcbInput,
.RadComboBoxDropDown_Default
{
 font: 12px "Segoe UI", Arial, sans-serif;
 color: #333;
}

I've tried puttig a div in front of them and putting them in my own CSS but it does not override the default.  Can someone tell me how I'd need to write the css to override the above?  Please help!!  Thank you.

[Michael Thornton]

Well I can get it to semi override if I put the style beginning with the div. tag in the master page head tag but not an external css class?  The css class is referenced in the head tag of the same master page.  Anyone know why this might not be working?  Thank you.

div.RadComboBox_Default,
div.RadComboBox_Default .rcbInput,
div.RadComboBoxDropDown_Default
{
 font: 12px "Segoe UI", Arial, sans-serif;
 color: #333;
}

[Kamen Bundev]

Hello Michael Thornton,

You should raise your classes' specificity if you want to override the corresponding classes in the embedded CSS file. This is easy achievable by adding the element type in front of every class and it should work regardless of the file. Check this article on specificity for reference. If it still doesn't work, check if the file it is in is properly loaded.

Greetings,
Kamen Bundev
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.