Force a Background Color in TinyMCE

CSS

So you’ve put together a CSS template with a body background color. We’ll use #4C4C4C. Your CSS template contains a content area that is a different color. We’ll use #000000. In simple form that looks like this:

body {
    background-color: #4C4C4C;
}
#content {
    width: 700px;
    margin: 0 auto;
    background-color:#000000;
    color: #FFFFFF;
}

Now if your content area is black, wouldn’t it be nice to edit your content in TinyMCE on a black background? Assuming you have TinyMCE importing your sites stylesheet, here is the trick:

* .mceContentBody {
    background: #000000;
}

That’s it!  Super easy.  If you have a better way of doing this feel free to comment.

Bookmark and Share
1 Comment

One Response

  1. Aimee  •  September 7, 2009 @11:14 am

    Thank you! Very simple solution to this problem.

Leave a Reply

Allowed tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" line="" escaped="">