CKEditor 4 combinate css

Question

I use CSS on my website to style the items.

In my (own developed) CMS I use CKEditor as WYSIWYG-editor.

I would like the editor to have the same style as the content on my webpage. The CSS of my page looks like this:

.content 
{
    ...
}
.content ul, .content ol 
{
    ...
}
.content p
{
    ...
}

But the stylesheet of CKEditor (contents.css) looks like this:

body
{
    ...
}
ol,ul,dl
{
    ...
}

h1,h2,h3,h4,h5,h6
{
    ...
}

Is there a way to make this in to one stylesheet, or to edit CKEditor, so a div.content is added?

---

I found the answer, change config.js to:

CKEDITOR.editorConfig = function( config ) {
    config.bodyClass = 'content'; //class that body needs to refer to
    config.contentsCss = '/css/beheer.css'; //your stylesheet

Answer 1

In CKEDITOR, you write a <div> tag for any of your ol,ul,dl,h1,etc elements..

Just go to source code button in CKEDITOR and then you can edit the way you want.

Answer 2

Like I edited on the startpost, I found the answer myself:

Change config.js to:

CKEDITOR.editorConfig = function( config ) {
    config.bodyClass = 'content'; //class that body needs to refer to
    config.contentsCss = '/css/beheer.css'; //your stylesheet