MJML Image size issues

[robm]

Your software
My Mautic version is: 4.4.2
My PHP version is: 7.4
My Database type and version is:

Your problem
My problem is: I am playing with the MJML builder for the 1st time. I have dropped in a section, col and then image element and placed an image in there. Image shows great in the builder, ie the right size.

But when I preview the email, or send a test email, the image is only 50px wide. Inspecting the image I can see a HTML style tag that is setting the width at 50px.

Going back into the builder and looking at the MJML code next to the HTML code I can see this style tag of 50px being added in the HTML code

Steps I have tried to fix the problem: I have set the dimensions of the image in image options in the builder. I looked at the col and section settings to see if anything there that is forcing the resize and can’t find anything. The original image uploaded to mautic is far wider than 50px.

How can I get image to display in the email at a size that does not require a magnifying glass to see?

[robm]

So I found the issue

Set <mj-body /> width to a percentage value render images with a fixed width of 20px

In my case the images were limited to 50 and not 20.

The fix is to open edit the MJML code and change the

<mj-body width="100%" />

which is likley to be line 2 in the code and chnage it to a fixed pixel width. I changed it to

<mj-body width="1080px" />

and then images were correct in size. The emails still look good in gmail and on my phone are responsive I can’t test with other clients.

Would there be any issues with using a hard pixel limit rather than a percentage?

[captainmorgan]

I just ran into this issue too. Is nobody else having this problem?

[volcania_dread]

Hey how’s it going?

do you know maybe how to fix this issue in the blank form (html)? everything looks great in my builder / preview. but when I send a test the images are huge. I tried to change something in the code to 1080px but it didn’t work:)