It’s because the RTE pulls the styling from your sites global styles. So if your paragraphs across your website are 15px in height with 27px line-height with a color of #333 then the paragraphs in the RTE will get the same thing applied to it. so on with H1’s, H2’s etc.
Now there is a way to style it separately from the other global styles using a little bit of custom CSS. You can start by giving the Rich text element on your blog posts a name, like .post-content.
Then you will need to target these with CSS in the <head> of your posts pages (in settings for the posts page, which will automatically generate these styles for all posts) custom code like so:
That would style only the paragraphs within the RTE itself with that class. Then for the Heading tags you would just change the p to an H1 or an H2 etc., or whatever one you wish to change.
Whoops, I got to this late – what was the first video? I watched the RTE webflow university video on nested elements but thought it might have been possible to alter it without nesting an element
Hiya, I’m trying to edit the Blog Post Template of my site but when I preview it my H1 seems to go missing and I can’t understand why; I can’t seem to see the nested element selector when I click on the H1, and adding another class to make it a combo class doesn’t seem to work.
I have the same issue when I try to edit the RTB of my blog text, please help
I moved your duplicate post back to your original post.
I believe your problem is this:
When you add a Rich Text Element to a CMS template, you can assign a class to the element, but you cannot style its children since the content is loaded from the CMS when it is bound to a rich text field in the collection.
Un-bind the element and then apply your nested styles. When you are done, bind the element again.
Example:
My preference is to style items in my designs by placing the element on a style guide page where I add the class(s), and in the case of a RTE, all the nested styles. Then when I need to reuse the styled element, I just apply the style(s) to a new instance or copy and past it.
This way, I always have a current reference I can visually inspect. This is also very helpful when using combo classes.
I’m still a bit stuck as to why it’s not visible after deleting all the classes and I can’t seem to figure out how to bind and unbind it – could you please help with this?