Email text align center all the time

Hi

After migrating to v5 I have this annoying problem with email templates where the text is always aligned in the center.
I looked into the css and I found thys styling, but I don’t understand where can i make the change to align text left.

div style=“border: 1px solid #c2c2c2; border-top: none; border-bottom: none; padding: 20px; text-align: left” id=“content”

Hi,

@david any thoughts?

@fxdamian

Within the template you can override the alignment by wrapping the content in a div, for example the invoice template looks like this:


<div style="text-align:left;">
<p>$client<br>
<br>Reminder for invoice $number for $balance</p>
</div>
<div class="center">$view_button</div>

This is very buggy, unless I am being very stupid, which is quite possible.

Where should I be editing the template?

Settings - Templates & reminders.
Then select template on the right side with the pulldown menu.

How do I align the button left?

Try this

<div style="text-align:left;">
<p>$client<br>
<br>Reminder for invoice $number for $balance</p>
<div>$view_button</div>
</div>

image

Another option to try is to reset the template to the default on Settings > Templates & Reminders and then set the “Email alignment” option to “Left” on Settings > Email Settings.

I couldn’t find the option in the react app but in the flutter app it is set already:
image

The problem is the table align attribute on the table around the a tag:

<table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation">
        <tbody><tr>
        <td align="center" class="new_button" style="border-radius: 2px; background-color: #0398FC">
            <a href="XXX" target="_blank" class="new_button" style="text-decoration: none; border: 1px solid #0398FC; display: inline-block; border-radius: 2px; padding-top: 15px; padding-bottom: 15px; padding-left: 25px; padding-right: 25px; font-size: 20px; color: #fff">
            <singleline label="cta button">Jetzt bezahlen</singleline>
            </a>
        </td>
        </tr>
        </tbody>
        </table>

@david do you have any suggestions?

@david any suggestions?

Hi there,

the $view_button place holder defaults the content to the center, if you prefer to left align, simply remove the $view_button placeholder, cut and paste the next you have above, and set the left alignment on the td… more info here

1 Like

@david too simple, but I didn’t manage to think out of the box :grinning: thanks a lot