Style content in ckeditor

To see your content in the ckeditor the same way, or close to it, that it appears when viewed, you need to add your custom styles to one of the CSS files loaded by the editor.

The ckeditor.css file is loaded. It is located in modules/ckeditor/css/ckeditor.css. You could place your custom css there.

However, your default theme’s style.css is also loaded. It is better to place it there since you already have to have it there to show up when viewed.

You might have already added your custom css to your theme’s style.css file and it still is not showing in your ckeditor.

When you look at the files loaded by the editor iframe you might see this:

If so, then check your Editor CSS setting in your ckeditor profile (e.g., Basic, Full HTML). Set it to Use theme CSS.