Block CSS collide with CSS rules already defined in template
No community answers yet. Open the original discussion on GitHub to share your solution.
Question
For block specific styles I'd recommend just using style tag If you want to preload external stylesheet inside the canvas Hi @artf When using <style> tag to define styles inside the 'content', after the block is dropped on the canvas, the css rules of the block overrides those of the elements that already in the canvas with the same selector. For example, if the block has the following rules .class1{ color: #fff; } After the block is added, the other elements not inside the block that also have the 'class1' will also have the color changed to white Even after I removed the newly added block,...
Answers (0)
No answers yet.
Related Questions and Answers
Continue research with similar issue discussions.
Issue #1807
GrapeJs framework breaks on adding external stylesheet
When i add my external stylesheet using the grapesjs framework no more works. How can I have the style sheet as well as the grapesjs framew...
Issue #3401
Can style manager always generate IDs instead of using already defined element's class ?
When we style an element in the editor, if this element doesn't have neither a class or an id, the style manager generate a new id with the...
Issue #442
Is it possible to include an external stylesheet in the grapesjs canvas?
We want to create some custom components whose style changes according to an external theme css (there can be different themes), and we wan...
Issue #3219
Add Type for block and css with class name
Hi @artf I am stuck on one thing I want to add one block in which I want to add style with the class name also Here is my code -: This give...
Paid Plugins That Match This Issue
Curated by issue keywords and label relevance to help you ship faster.
Loading paid plugin recommendations...
Check the open-source GrapesJS plugins on GitHub or run a quick search in our free catalog.
Browse free plugins →Premium plugins ship with support, regular updates, and production-ready features — save days of integration work.
Browse premium plugins →Related tutorials
In-depth guides on the same topic.
Tutorial
UnStudio for GrapesJS: 4 Plugins to Build Better Visual Editors
Meet UnStudio, a new GrapesJS plugin studio with four tools, safer and better editor: Command Palette, Responsive Pack, Autosave & Restore, and Autofill
Tutorial
Claude Skill for GrapesJS: How AI Is Changing the Way We Build Visual Editors
We've released the Claude Skill for GrapesJS Development — a free, open-source skill that turns Claude into a developer who actually knows GrapesJS
Tutorial
Messaging on gjs.market: talk to a studio before you buy, not after
We've launched private messaging between buyers and studios. One thread per buyer–studio pair, the whole history in one place.
Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.