mj-divider not centered on outlook

[Grafikart]

Dividers works on gmail but when opened online with outlook.com they are aligned to the left

<mj-divider width="100px" border-color="#033242" border-width="1px">

Screenshots :

Gmail

Outlook

Email code

Gmail renders HTML this way

<td style="word-break:break-word;font-size:0px;padding:10px 25px;border-collapse:collapse">
<p style="font-size:1px;margin:0 auto;border-top:1px solid #033242;width:100px;display:block"></p></td>

Outlook this way

<td style="word-break:break-word;font-size:0px;padding:10px 25px;">
<p style="font-size:1px;border-top:1px solid #033242;width:100px;"></p>
</td>

[ngarnier]

Thanks @Grafikart. Could you also please join the MJML used?

Cheers!

[Grafikart]

<mjml>
    <mj-head>
        <mj-attributes>
            <mj-divider width="100px" border-color="#033242" border-width="1px"/>
        </mj-attributes>
    </mj-head>
    <mj-body>
        <mj-container>
            <mj-section>
                <mj-column>
                    <mj-text mj-class="title">STORIES FROM THE FIELD</mj-text>
                    <mj-divider></mj-divider>
                </mj-column>
            </mj-section>
        </mj-container>
    </mj-body>
</mjml>

[tcaddy]

Can you wrap this content in a <center> tag to workaround this issue? I had some text that wasn't centered in MS Outlook (despite declaring it centered in the <mj-section> and <mj-text> tags). Wrapping it in the <center> tag fixed the issue in Outlook.

[iRyusa]

Outlook.com remove margin by default... mhh we have to find another way to align without it..

[iRyusa]

Ok we have to replace every margin by Margin and it will fix this.. cf hteumeuleu/email-bugs#6 Silly outlook

[Grafikart]

Nice catch 👍

[iRyusa]

Small update here, it will no longer be the case in MJML4. So i'm adding it to the 4.0 milestone instead of 3.3.X

[ngarnier]

This should be fixed in the latest MJML 4 beta, install with npm install mjml@next.