Search code examples
pythonhtmlgmailhtml-emailmime

table.tableize-table r function works well in .html, but not display in Gmail through MIMEText


Newbe working on html. I got below settings in .html, and it works as expected when opening the file in a browser (chrom/safari).

(in browser)output seen opened in browser--> (failed in gmail) undesired content received in gmail

However, when I use MIMEText to send the same html content, it fails: none of the color code features are preserved. It does not matter that attribute I tried to edit in table.tableizer-table, font-size, border, none works when sent in email.

<html><body>
    <style type="text/css">
        table.tableizer-table {
        font-size: 12px;
        border: 1px solid #CCC;
        font-family: Arial, Helvetica, sans-serif;
    }
        .tableizer-table td {
        padding: 4px;
        margin: 3px;
        border: 1px solid #CCC;
    }
        .tableizer-table th {
        background-color: #009452;
        color: #FFF;
        font-weight: bold;
    }
        .tableizer-firstrow td {
        background-color: #009452;
        color: #FFF;
        display: inline-block;
    }

    </style>

    <table class="tableizer-table">

    <thead>
        <tr style="background-color:#104E8B; color: #ffffff;"><td align="center" rowspan="1" colspan="5" ><strong>RECORD <strong></td></tr>
    </thead>

    <tbody>

    <tr class="tableizer-firstrow"><th style="background-color: #CCC;color: #FFF;">GOOD COMPANY</th><th>EMAIL</th><th>PHONE</th><th>ADDRESS</th></tr>
    <tr><td>company2</a></td><td style="text-align: right;">0</td><td>100</td><td>1st Ave</td></tr>
    <tr class="tableizer-firstrow"><th style="background-color: #CCC;color: #FFF;">BAD COMPANY</th><th>EMAIL</th><th>PHONE</th><th>ADDRESS</th></tr>
    <tr><td>company2</a></td><td style="text-align: right;">0</td><td>212</td><td>Fifth Ave</td></tr>

  </tbody>
  </table>
</body>
</html>

I am working primarily on python and email is sent as below:

import smtplib, ssl
from email.mime.text import MIMEText
from email.mime.multipart import MIMEMultipart

message = MIMEMultipart("alternative", None, [MIMEText(one_email_html, 'html')])
receiver = 'aaa@gmail.com'
sender_email = 'bbb@gmail.com'
print('Type in password')
password = input()
message["Subject"] = subject
message["From"] = sender_email
message["To"] = receiver

# Create secure connection with server and send email
context = ssl.create_default_context()
with smtplib.SMTP_SSL("smtp.gmail.com", 465, context=context) as server:
    server.login(sender_email, password)
    server.sendmail(
        sender_email, receiver, message.as_string()
    )

where one_email_html is the """string""" of the html content.


Solution

  • You should be placing the <style> section inside <head>...</head> tags.

    Second, you should inline all embedded styles. This is why this works: <tr style="background-color:#104E8B; color: #ffffff;">, but your classes don't. Some email clients, such as some forms of Gmail, and most desktop and webmail environments, do not support embedded styles at all (styles within <style>).

    Third, perhaps you need to use the full hex, rather than shortened hex codes. So <th style="background-color: #CCC;color: #FFF;"> becomes: <th style="background-color: #CCCCCC;color: #FFFFFF;">, for example.