CSS Color on Editor Background

[Eric]

I have a CSS style for my page that sets the background to a gradient.

background: url(../images/global/bg.png) 50% 50% repeat-x;

On my page, I have an editor that now has this gradient as the background. i would like for the background of the editor to be white. How can I do this?

Thanks for any help.

[Angie]

I would like to add to chabian's question.

Is it possible to have the Editor not apply the elements of the global site css?  I'm using the Web20 skin, but my standard <UL> and <LI> element styles for the site are messing up the appearance of the toolbars on the editor.  Looks like some additional padding is being applied as well.

I also need to set the background to white.

Thanks.

[Rumen]

Hi guys,

Up to the questions:

1. Erik: By default RadEditor copies the styles from the parent page and applies them to its content area. To configure the editor to not pick up the styles just set the CssFiles property of the editor to an external css file and this should fix the backround problem.
2. Angie: Generally, it is not recommended to use global styles with third party controls because obviously the third party controls consist HTML and your global styles can easily spoil their design. Nevertheless, if you open a support ticket and send us a sample running project that demonstrates the toolbar appearance problem, we will provide a solution.
   
   Guys, you can also see the following help article: Setting Editor Background And Color.

Best regards,
Rumen
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

[Eric]

I searched those articles and tried the solutions already, including adding the !important to the background color element. The editor still picks up the background gradient on the page. Any other thoughts?

[Rumen]

Hi Chabian,

Could you please tell me whether you have set the CssFiles property or the ContentAreaCssFile property? My suggestion is to set the CssFiles property, instead of ContentAreaCssFile and test the editor again.

If you set the CssFiles property, the editor will not pick up the styles from the parent page, e.g.

Default1.aspx

<telerik:RadEditor runat="server" ID="RadEditor1">
    <CssFiles>
        <telerik:EditorCssFile Value="~/external.css"
    </CssFiles>
</telerik:RadEditor>

external.css

body
{
   background-color: white !important;
   color: black !important;
   font-size: 14px !important
}


If the problem still persists, please open a support ticket and send a sample working project that demonstrates the problem. I will examine it and provide a solution.

Sincerely,
Rumen
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center