Problem with element positioning in a multi-column layout
You can add this to pluginOpts inside grapesjs.init: This will probably also fix your previous alignment issues and is much better for responsive design
Read full answer below ↓Question
How to control the position of the elements in the cells in columns? On the left side, I have the map element, and on the right, I have a Text and Image. As seen in the screenshot below, the elements on the right are positioned after the map. A similar problem is there in this codepen (Grapesjs Custom UI by @artf ) too.
Answers (3)
You can add this to pluginOpts inside grapesjs.init: This will probably also fix your previous alignment issues and is much better for responsive design
@theSC0RP This is not really a problem with GrapesJS itself. The cell in GrapesJS has property, so it tries to simulate a table layout, as far as I'm aware. So if you want to change the positioning, then find a way to vertically change position in a table. One solution might be See https://develope...
@MartinPutz Thank you for the answer. How would I create and apply a custom style property on the cell? I am using the grapesjs-blocks-basic plugin so the cell has a class name of 'gjs-cell'. I tried to add the suggested property on this class in my styles file but the problem is still there.
Related Questions and Answers
Continue research with similar issue discussions.
Issue #3389
MultiSelect some elements and change styles only work on the last selected element
Hi, when I MultiSelect some elements using shift, and change style in styleManager. Only the last clicked element will update the style. Ca...
Issue #3825
Ckeditor wrap and block the text below
GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome Reproducible demo link https:// Des...
Issue #6562
Moved element snaps to wrong position on resize
GrapesJS version [x] I confirm to use the latest version of GrapesJS What browser are you using? Chrome 138.0.7204.101 Reproducible demo li...
Issue #2547
Unable to drag an element if style has bottom or right values
Hi @artf , If any component CSS has bottom or right values , not able to drag them. Values are generating as NaN. Attached the screenshot f...
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
Vanilla GrapesJS vs GrapesJS With Plugins: What You Actually Get Out of the Box (2026)
New to GrapesJS? See exactly what the stock editor gives you, where it falls short, and which plugins close the gaps — a beginner-friendly 2026 comparison
Tutorial
Lighthouse for GrapesJS: Audit Accessibility and SEO Without Leaving the Editor
Live WCAG 2.1/2.2 accessibility auditor + SEO manager for GrapesJS. Every finding is bound to the exact component — click to select, then one-click fix.
Tutorial
Introducing GJS.Market Services: ship your GrapesJS editor without the integration risk
It's everything that usually eats weeks of engineering time, scoped and priced up front. No open-ended hourly surprises.
Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.