Newsletter made with GrapesJS does not render nicely on Mobile
The workaround to this issue is setting the body to 100% width & height, then the email container itself should have a max-width of 550px and width of 100%, then height: auto and min-height: 100vh or 150px
Read full answer below ↓Question
Version: v0.16.22 Are you able to reproduce the bug from the demo? [X] Yes (Newsletter Demo) How to reproduce Export the default template or your own template (after you imported it) and send it using [](https://putsmail.com/). Open the mail on an iPhone. What is the expected behavior? When sent to a mobile device (in my case iOS) the email should use the full width of the display Describe the bug detailed I use Mailtrain to send newsletters. Mailtrain integrates GrapesJS to help visualize and edit the emails before sending them. I usually import a template that is known to work fine on mobil...
Answers (2)
The workaround to this issue is setting the body to 100% width & height, then the email container itself should have a max-width of 550px and width of 100%, then height: auto and min-height: 100vh or 150px
Hi @terdinatore the core of GrapesJS is about creating the editor for building stuff with HTML/CSS/JS, but building the right email blocks/components is up to who integrates the editor
Related Questions and Answers
Continue research with similar issue discussions.
Issue #5937
image send to mail
GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? chromeReproducible demo link https://grapesj...
Issue #3125
linear-gradient CSS does weird things to background-image
Version: 0.16.27 Are you able to reproduce the bug from the demo? [x] Yes [ ] No What is the expected behavior? When adding background-imag...
Issue #3454
RTE insert link does not update DOM
Version: "0.17.3" Are you able to reproduce the bug from the demo?[X] Yes[ ] No What is the expected behavior? After inserting link using d...
Issue #5583
Can't set background:none in mobile version using styles panel
GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Edge last version Reproducible demo link h...
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 →Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.