Responsive menus for your emails

Sartre Email comes with Navigation sections that make it easy to add HTML menus to your emails.

There are two types:

  • Basic
  • Hamburger

Each with the following variations:

  • Centered
  • Left Aligned
  • Right Aligned


Simple table structure, where each menu item is a table cell that contains an anchor tag.

Navigation Basic Centered


The Hamburger Navigation looks similar to the Basic one on desktop, but on mobile its items are hidden and a menu icon is shown instead. Touching the icon reveals the menu items.

Navigation Hamburger Centered


Text & Links

Text and link can be customised with inline CSS:

<a href="" style="color: #000000; font-size: 12px;">Menu item</a>


Each nav-item uses horizontal padding. For mobile, the mobile spacing helpers in Acorn are being used:

<td class="nav-item webfont px-sm-8" style="padding-right: 24px; display: inline-block;">

Navigation sections don't use top and bottom spacing. You can add a Spacing section above and below them.