<p>The best solution I know of is to install the <a href="https://github.com/doublesecretagency/craft-cpcss" rel="nofollow noreferrer">Control Panel CSS</a> plugin. When you add the css you'll want to target the elements inside Redactor so you don't change the whole Craft CP. For example, add ".redactor-box " before any elements you need to style.</p>

<pre><code>.redactor-box p {
    margin-bottom: 50px;
}
</code></pre>

CC BY-SA 4.0
2019-06-05T23:40:39.613Z
Thanks Simon - yeah i think your right for now - its a shame for just simple sites we couldn't just throw HTML content into Redactor and it use the CSS from the actual page to style it in the CP (or at least you could switch it on as an option maybe)
Malcolm Maclean
CC BY-SA 4.0
2019-06-06T02:11:00.707Z
@user2350248 Using Gulp and SASS (or some other preprocessor) I wouldn’t be surprised if you could automate wrapping all your CSS in .redactor-box {} and outputting it to a separate CSS file. That file could then be given to Control Panel CSS for a automated and live updating solution.
Simon Kuran
CC BY-SA 4.0
2019-06-05T17:27:43.363Z
2019-06-05T17:27:43.363Z
Simon Kuran
<p>is it possible for Redactor or any of the other editors to actually inherit the styles from the (front end) page it is editing?  My client has bootstrap columns etc and the pages have some elements with backgrounds and i wanted to make the content look more like the actual website they are editing rather than one long block of text.</p>

<p>I hacked around in the Redactor CSS files and i can kind of get it working by importing my sites stylesheets into the Redactor one but then that affects the whole Entry page's styles and also hacking in Redactors styles doesn't seem the best. </p>

<p>I do realise probably the best way to do this properly would be to create blocks for each type of content with Matrix (2 col or 1 col etc) and recreate all page elements but the site is coming from another system with lots of static pages and i just wanted my client to have a simple way to edit the existing content.</p>

<p>Anyone any ideas if this is possible at all?</p>

<p>Malcolm</p>

<redactor><richtext>
Redactor or another HTML editor that can inherit actual page styles?
# Redactor or another HTML editor that can inherit actual page styles?

(Asked by: username_0 on 2019-06-04)

is it possible for Redactor or any of the other editors to actually inherit the styles from the (front end) page it is editing? My client has bootstrap columns etc and the pages have some elements with backgrounds and i wanted to make the content look more like the actual website they are editing rather than one long block of text.

I hacked around in the Redactor CSS files and i can kind of get it working by importing my sites stylesheets into the Redactor one but then that affects the whole Entry page's styles and also hacking in Redactors styles doesn't seem the best.

I do realise probably the best way to do this properly would be to create blocks for each type of content with Matrix (2 col or 1 col etc) and recreate all page elements but the site is coming from another system with lots of static pages and i just wanted my client to have a simple way to edit the existing content.

Anyone any ideas if this is possible at all?

Malcolm

**Tags:** redactor, richtext

---

## 1 answers

### Answer by username_1 on 2019-06-05. Score: 1 | Accepted answer

The best solution I know of is to install the Control Panel CSS plugin. When you add the css you'll want to target the elements inside Redactor so you don't change the whole Craft CP. For example, add ".redactor-box " before any elements you need to style.
.redactor-box p {
    margin-bottom: 50px;
}

> **Comments:**
> **username_0**: Thanks Simon - yeah i think your right for now - its a shame for just simple sites we couldn't just throw HTML content into Redactor and it use the CSS from the actual page to style it in the CP (or at least you could switch it on as an option maybe)  
> **username_1**: @user2350248 Using Gulp and SASS (or some other preprocessor) I wouldn’t be surprised if you could automate wrapping all your CSS in .redactor-box {} and outputting it to a separate CSS file. That file could then be given to Control Panel CSS for a automated and live updating solution.  

---

