I'm trying to center a mjml container but assign the text to left-adjustment.
I've been playing around with align="center" and text-align in various tags, but I can't seem to find a solution.
<mjml>
<mj-body>
<mj-section>
<mj-column border="1px solid black">
<mj-text align="center">
<div style="text-align: left !important;">Text should be in middle of container<br>but left-adjusted.</br>
</div>
</mj-text>
</mj-column>
</mj-section>
</mj-body>
</mjml>
In my sample code, using align="center" moves the enter text in the middle of the screen (great!) but there's nothing that forces the text to left-adjustment.
It's a little unclear what you want, but I've got a centered container with left-aligned text with the following code:
<mjml>
<mj-body>
<mj-section>
<mj-column border="1px solid black" align="center">
<mj-text style="text-align: left;">Text should be in middle of container<br>but left-adjusted.</br>
</mj-text>
</mj-column>
</mj-section>
</mj-body>
</mjml>
The key was not to put the mj-text as center aligned, as that's the text part.