[Bug]: Styles allways applied to classes

Question

Hello, I have a Problem with styling individual Items. The following html Code: Loads fine. But when I Click the Component with "#icbp" then the class .ddm-flex-cols-element will get the style max-width. Setting this.el.style while rendering the Object is also Integrated to the CSS (Id only) the Docs tell changes to this.el will not being saved to Components. Reproduction with DEMO is not possible for me because its only happening with some loaded canvas styles. I'm using version 0.14.57 My Con...

artf · Accepted Answer

Can you please try to add this to your options avoidInlineStyle: true and let me know

3dmedium · Answer

Hi @artf , Yes I tried this, still no luck. I had the time to minimize this issue to a codesandbox: https://codesandbox.io/embed/jnplq7op55 Position of the protectedCss Content can be varied put it to style or in a file and load it by cvanvas.style the behavior keeps the same. The Issue is gone by deactivationg selectors before adding components: from #1979 (both versions work) for me this is a solutuion but I think in some cases it might not. Best regards

artf · Answer

Ok, the problem happens here: https://github.com/artf/grapesjs/blob/e97afb429b4cada591e119025fcf34490cb0de8c/src/style_manager/index.js#L284-L285 if there is no CSS rule with the selector found on the component (in our case ddm-flex-cols-element) the rule is created and all its styles are moved to the rule. I think I made it for the optimization reason but now I'm not quite sure if it's the right approach...

Styles allways applied to classes

Question

Answers (3)

Related Questions and Answers

[Bug]: Grapes change page position

[BUG] Link elements are not copyable/deletable

Span are not editable as text

[Question] Can i push toolbar in current modal and current modal child?

Paid Plugins That Match This Issue

Related tutorials

🚀 Introducing GrapesJS Email Blocky: The Ultimate Email Block Library for GrapesJS

Browse Plugin Categories