Home > Mobile >  How to centre this html in an email?
How to centre this html in an email?

Time:04-05

I'm struggling with the html in this email (for a booking management tool called [https://www.checkfront.com/][1]).

This code works fine sent from gmail to gmail, Office to gmail, pagebuilder to gmail, etc. When sent from Checkfront's HTML editor as a booking notification to gmail, my "justify-content" styling is stripped away.

 <tr id="5imagesSection"  style="display: flex; justify-content: center !important;">
<td id="smileyImage1"><a href="https://mymarbellaweekender.com/product-category/boats-and-yachts/"><img src="https://mymarbellaweekender.com/wp-content/uploads/2022/03/Circle1300.png" height="100" width="100" alt="My Marbella Weekender" data-image="dhvrprieupdm"></a></td>
<td id="smileyImage2" style="margin-top:10%;"><a href="https://mymarbellaweekender.com/product/shuttle-transfers/"><img src="https://mymarbellaweekender.com/wp-content/uploads/2022/03/Circle2300.png" height="100" width="100" alt="My Marbella Weekender" data-image="un1eob2gwjf1"></a></td>
<td id="smileyImage3" style="margin-top:20%"><a href="https://mymarbellaweekender.com/product-category/beach-pool-clubs/"><img src="https://mymarbellaweekender.com/wp-content/uploads/2022/03/Circle3300.png" height="100" width="100" alt="My Marbella Weekender" data-image="veaowxr4ebv6"></a></td>
<td id="smileyImage4" style="margin-top:10%;"><a href="https://mymarbellaweekender.com/product/decor-balloons/"><img src="https://mymarbellaweekender.com/wp-content/uploads/2022/03/Circle4300.png" height="100" width="100" alt="My Marbella Weekender" data-image="oxyhrbhzvjhi"></a></td>
<td id="smileyImage5"><a href="https://mymarbellaweekender.com/wp-content/uploads/2017/09/Catering-Menus-2022.pdf"><img src="https://mymarbellaweekender.com/wp-content/uploads/2022/03/Circle5300.png" height="100" width="100" alt="My Marbella Weekender" data-image="uy3cf06q540k"></a></td></tr>

Image of HTML not being justified to center and justify-content:center being 'removed'

Here is the code for the whole email: https://codepen.io/Grabgooglesgoogles/pen/OJOGjYz

I would love feedback in case there is an aspect of the code which doesn't follow best practices and in case these other clients are all making allowances for my lack of knowledge

  • Related