How to make CKEditor render text with a CSS?

Question

I have a CKEditor used to edit a text in a web-page.

In the web-page, the text renders in its context and therefore follows the page CSS formatting.

My question is how to tell CKEditor to apply a CSS style-sheet to the editor rendering ? Without of course changing the generated source ?

My code :

<textarea class="ActuContent" name="actu-content" cols="100" rows="20">my content></textarea> <script type="text/javascript">         window.onload = function()         {                 CKEDITOR.replace( 'actu-content' );         }; </script> 

and my CSS :

.ActuContent{     padding:10px 10px 10px 10px;     color:#416a8b;     font-size:1.6em; } 

And my CKEditor Config.js file only contains the toolbar config.

CKeditor does not apply the settings of ".ActuContent" to its rendering ...

Answer 1

The actual best answer to this question would be:

CKEDITOR.config.contentsCss = '/mycustom.css'; CKEDITOR.replace('myfield'); 

Because you probably would like to have different styles in different editors. If you change the main content.css like Jalil did, you would not be able to do that.