Я маркетолог, который занимается написанием кода для создания почтовых рассылок с элементами перетаскивания. Для нового шаблона я хочу создать специальный заголовок макета c, но когда я использую приведенный ниже код, он выглядит странно в мобильной версии электронного письма. Иконки социальных сетей сосредоточены под текстом «Присоединяйтесь к нашему онлайн-сообществу». Я могу использовать только inline CSS для этого.
Можете ли вы помочь мне исправить это, пожалуйста?
<table style="width: 100%; font-size: 12px; font-family: Arial;" cellpadding="8"> <tbody> <tr style="height: 26px;"> <td style="width: 69.7631%; height: 26px;"><span style="color: #ffffff;">Join our online community</span></td> <td style="width: 7%; height: 26px;"><a href="https://www.facebook.com/unicollege" target="_blank" rel="noopener"><img style="display: block; margin-left: auto; margin-right: auto;" src="https://emma-assets.s3.amazonaws.com/31sab/4f59667a77a167ed598590b3bfca4b54/facebooksmall.png" alt="" width="14" height="14" /></a></td> <td style="width: 7%; height: 26px;"><a href="https://www.instagram.com/unicollege_sa/" target="_blank" rel="noopener"><img style="display: block; margin-left: auto; margin-right: auto;" src="https://emma-assets.s3.amazonaws.com/31sab/bb1635c88e5a0605763fc225905713ef/instagramsmall.png" alt="" width="14" height="14" /></a></td> <td style="width: 7%; height: 26px;"><a href="https://www.linkedin.com/school/unicollege/" target="_blank" rel="noopener"><img style="display: block; margin-left: auto; margin-right: auto;" src="https://emma-assets.s3.amazonaws.com/31sab/ef924cfcf68607be45492c5aba69ab56/linkedinsmall.png" alt="" width="14" height="14" /></a></td> </tr> </tbody> </table>