0Pricing
HTML Academy · Lesson

Inline Styles for Email

Apply CSS inline to ensure consistent rendering across email clients.

Why Inline Styles?

Many email clients — most notoriously Gmail web before May 2016 and several mobile apps still today — strip or rewrite <style> blocks and external stylesheets. Inline style="..." attributes are the only CSS guaranteed to survive every client.

Author in External CSS, Ship Inlined

Writing inline styles by hand is unmaintainable. Author the email with normal <style> tags and class names, then run an inliner (Juice, Premailer, mjml) at build time to copy each rule into the matching element's style attribute before shipping.

All lessons in this course

  1. The Table-Based Layout Approach
  2. Inline Styles for Email
  3. Image Handling in Email Clients
  4. Testing with Litmus and Email on Acid
← Back to HTML Academy