Section should be overlapping issue present in grapes js

Question

GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Version 117.0.5938.134 (Official Build) (64-bit) Reproducible demo link https://jsfiddle.net/ap404703/0e5zop1n/ Describe the bug Example as below Grapes Js file :- // Initialize GrapesJS const editor = grapesjs.init({ canvas: { styles: [ "https://unpkg.com/tailwindcss@^2/dist/tailwind.min.css", "https://unpkg.com/swiper@7/swiper-bundle.min.css" ] }, styleManager: { // Configure the Style Manager cle...

artf · Accepted Answer

@ChiragS-Prajapati you have to use draggable/droppable component properties to control where components could be dragged and what components can be dropped inside.

GJS Helper · Answer

The issue you're encountering, where one section block can be dropped inside another, is a common behavior in GrapesJS by default. GrapesJS treats HTML elements like

and

as containers, allowing other components to be nested within them unless explicitly told otherwise. Your custom blocks, being

elements, are therefore droppable targets. Root Cause The default component model for a section element in GrapesJS allows it to accept child components. When you define your bl...

Section should be overlapping issue present in grapes js

Question

Answers (2)

Related Questions and Answers

MousePosFetcher in resizer config & change:style listener not working

Inline style overrides ID-based CSS rules

ColorPicker Offset incorrect when Panels are outside of Editor Container

NO NEED anyone can reproduceDescribe the bug

Paid Plugins That Match This Issue

Browse Plugin Categories