How to change the background color of AjaxControlToolkit HtmlEditorExtender control?

Question

I'm using the HtmlEditorExtender control of the AJAX Control Toolkit and I want to change the editor's background color to another color.

How can I do that?

Answer 1

You just have to target the css class that the AJAXControlToolkit uses to style that element. In this case, it is the ajax__html_editor_extender_texteditor class. The following css would make the background of the HTML editor orange:

.ajax__html_editor_extender_texteditor
{
    background-color:#FFA500;
}

Answer 2

Put all inside this div. Works nicely!

div style="background-color: white; width: 100%;background-color:white;padding:0px 10px 6px 0px;"

Answer 3

If you put the control and extender into a table, you can set the background color in the tag like so:

<td style="background-color: white;">
        <asp:TextBox ID="myTextBox" MaxLength="1000" Width="250px" Height="250px" TextMode="MultiLine" Rows="10" Wrap="true" runat="server" />
        <ajaxToolkit:HtmlEditorExtender ID="HtmlEditorExtender1" TargetControlID="myTextBox" runat="server"/>
</td>

Answer 4

You try to define a css and set it to the CssClass attribute of HtmlEditorExtender.

E.g

<style type="text/css">
.generalbox {
background-color:#F90
}
</style>


<cc2:Editor ID="txtDescription" CssClass="generalbox" runat="server"  Height="300px" AutoFocus="true" Width="100%" />