Does anyone know why my buttons doesn’t fit to columns with the “expanded” class on Gmail Android (portrait) ?
It looks good on multiple Desktop client like Gmail webmail, iCloud Mail, and Outlook 2007.
When I put the smartphone in landscape mode on Gmail Android, it works fine!
So, the issue only appears on the Gmail app in portrait orientation.
[
]
This is the Inky code :
{# templatesemailemail_test.html.twig #}
{% apply inky_to_html|inline_css(source('@styles/foundation-emails.min.css')) %}
<container style="background-color:gold;">
<row style="background-color:blue;">
<columns small="12" large="8" valign="middle" style="background-color:#ffd0b2;">
<button class="expanded" href="#accepter">PRENDRE CONTACT</button>
</columns>
<columns small="12" large="4" valign="middle" style="background-color:#8fffe5;">
<button class="expanded" href="#refuser">REFUSER</button>
</columns>
</row>
</container>
{% endapply %}
I try to add wrapper and override some class attaching a custom class with this alternative code
{% apply inky_to_html|inline_css(source('@styles/foundation-emails.css'), source('@styles/email.css')) %}
I see this response, but it doesn’t explain how to circumvent the problem, if that’s even possible!
Foundation for Emails: Small View Port in Gmail app