CSS Help - Rich Text Background Property

Could you please help me set the background-color property for a rich text field?

I tried to reference it using:

table.k-widget, .k-editor .k-editor-widget .k-resizeable .k-editable-area, iframe.k-content, body.fd-form, .fd-editor-content{
background-color: red !important;
}

The background successfully flashes red for a moment, then it reverts to white.

Dear @LMonty,
Please, try the following JavaScript:

fd.spRendered(function(){
    fd.field('RichText').ready().then(function() {
      $(fd.field('RichText').$el).find('.k-editable-area')[0].style.backgroundColor = "red";
      fd.field('RichText').widget.body.style.backgroundColor = "red";
    });
});
1 Like

Thank you very much! That worked :slight_smile:

Is there a way to set this style for all rich text fields? Or do I need to repeat the function separately for each field?

Dear @LMonty,
It's inside an <iframe>, so the JavaScript is the only option. There are different ways of using JavaScript, for example, CSS files can be added to the editor, but that doesn't seem helpful in this case.