Outlook (Desktop Client) can be compared to that reserved kinda person who always stays aloof and never joins the amiable group of other email clients. However, it is interesting to know that despite this, it still enjoys 8% of email client share in the market (Litmus Email Analytics – December 2019). As an implication, we cannot overlook its rendering issues howsoever.
Looking for emails compatible with all email clients including Outlook? Order now>>
Let’s discuss one of the major problems of Outlook that bothers several email developers out there.
The Problem of Unordered Lists in Outlook
A queer rendering challenge that Outlook puts forth is that of unordered lists. While all the other email clients work great when it comes to lists, Outlook doesn’t show bullets with <ul> and <li> tags.
Check out the screenshot below:
Outlook 2003 won’t present this problem, but more recent versions of Outlook desktop client like Outlook 2007, 2010, 2013, and 2016 will invariably create an issue when it comes to the basic HTML tags of unordered lists.
The Workaround
To get rid of this problem, Campaign Monitor published a workaround which is quite successful but a bit too long.
We bring to you a simple workaround to beat this challenge.
Just insert the below-mentioned code to resolve the issue.
/*This is for Outlook 2007-10-13-16*/
<!– [if gte mso 9]>
<style>
li {text-align:-webkit-match-parent; display:list-item;text-indent: -1em;}
</style>
<![endif]–>
/*End for Outlook 2007-10-13-16*//*This is for Other all email clients*/
li {text-align:-webkit-match-parent; display:list-item;}
/*End for Other all email clients*/
Once you add this code, Outlook will display bullet points in your list… and that’s the end of your struggle. [We hope] 🙂
Here’s how it will look after the workaround:
Wrapping Up
Have you been forced to contend with any other challenges while working with Outlook?
Worked thanks
You’re welcome. Stay connected! 🙂
My question is where do you add this code? In the code around the or in the ?
Hey Drew,
The code will be included in the header.
Let us know if you need more help.
You can contact us at hello(at)Uplers(dot)com.