Created
December 15, 2015 18:43
-
-
Save kchez/1d7b9f39e4d3c9e33f8f to your computer and use it in GitHub Desktop.
Email - Faux Unordered/Ordered Lists:
The rendering of <ul> and <ol> is not reliable with a few email clients, instead you have to create faux lists.
Using two table cells you can mimic the same appearance of a bullet or number list. You can add widths, padding etc to space out list items
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!-- | |
| FAUX UNORDERED/ORDERED LISTS: | |
| The rendering of <ul> and <ol> is not reliable with a few email clients, instead you have to create faux lists. | |
| Using two table cells you can mimic the same appearance of a bullet or number list. | |
| You can add widths, padding etc to space out list items | |
| --> | |
| <table border="0" cellpadding="0" cellspacing="0"> | |
| <!-- Faux unordered list with a bullet --> | |
| <tr> | |
| <td align="left" valign="top">•</td> | |
| <td align="left" valign="top">Example List Item</td> | |
| </tr> | |
| <!-- Faux unordered list with a dash --> | |
| <tr> | |
| <td align="left" valign="top">‑</td> | |
| <td align="left" valign="top">Example List Item</td> | |
| </tr> | |
| <!-- Faux ordered list --> | |
| <tr> | |
| <td align="left" valign="top">1.</td> | |
| <td align="left" valign="top">Example List Item</td> | |
| </tr> | |
| </table> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment