CSS reset
Why the CSS Reset Matters
Email clients don’t start with the same base styles. Each one applies its own defaults—like Outlook adding extra table padding or Gmail making every link bright blue. A CSS reset removes these "factory settings" so your markup starts with a clean slate in every inbox.
Litmus calls a reset "a set of styling rules in the head of an email that account for known bugs or issues in various email clients … a clean, consistent foundation on which to code and style your emails."
How we built the NSW email reset
The NSW Email Design System includes this reset at the top of every template. It draws on years of community knowledge, especially open-source work, which documents both general reset rules and client-specific fixes.
What it does under the hood
The reset:
Removes margins and padding from the
bodyto avoid unexpected spacing in Outlook and GmailCollapses table borders to eliminate 1 px gaps in nested tables in Windows Outlook
Normalises images using border: 0; line-height: 100%; display: block; to avoid blue outlines and extra spacing
Overrides Gmail's blue links by using u + .body a { color: inherit; }
Fixes mobile quirks with -webkit-text-size-adjust: 100% and margin: 0 auto for fluid layouts on iOS
These rules are compiled in your template's <style> tag and inlined by Maizzle. Because they're part of the same file as your components, you can customise them—just keep changes above the /* NSW RESET END */ comment for easier updates.
Using and modifying the reset
Keep it at the top of the document to avoid being overridden during inlining
Only include what you need—excess CSS can push Gmail over its 102 kB limit
Test early. Use Litmus or Email on Acid if you add new rules
Version your changes. Save edits in _reset.css to track them in version control
Next steps
Clone the framework and explore _reset.css in context
Open a pull request if you discover new quirks—the reset should evolve with the ecosystem