CODEWITHSUNDEEP
flaskhtml-emailsendgrid
theo
theo

Reputation: 93

Importing CSS files with Flask Mail and SendGrid Does Not Work

I am using Flask and SendGrid to send emails and I can send emails with HTML but no CSS.

Here is my code for sending emails:

from app import mail
from flask import render_template, url_for
from flask_mail import Message

def send_email(to, subject, body):
    msg = Message(subject=subject, recipients=[to])
    msg.body = body
    msg.html = render_template('mail/email.html', body=body)
    mail.send(msg)

And here is how I am importing my CSS file (this works in every other file):

<link type="text/css" href="{{ url_for('static', filename='assets/css/pixel.min.css') }}" rel="stylesheet">

If there is a problem with the above code that would cause this to happen please let me know.

As I said earlier, my problem is that CSS files that I am importing into email.html are not styling the email. So is there any way to fix this, or will I have to use SendGrid email templates?

Upvotes: 2

Views: 678

Answers (1)

Nathan
Nathan

Reputation: 5204

The <link> element doesn't have good cross-email support. https://www.caniemail.com/features/html-link/

You should first inline the CSS within each element. There are services online that auto inline CSS for you.

Second, embed the CSS that can't be inlined (typically only media queries and hacks) within the HTML document, i.e. use <style>...</style> within the <head>.

The reason you can't just embed the CSS and forget about inlining is because, you guessed it, <style> isn't supported on everything! https://www.caniemail.com/features/html-style/

Upvotes: 3

Related Questions