DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’»

Matthew Dailey
Matthew Dailey

Posted on

How to fix extra list bullet in Outlook

Even though I don't code emails anymore, I wanted to share a fix for an Outlook bug I encountered awhile back. An extra unordered list bullet appears at the end of the list even though the code itself is correct and no empty <li> elements are present. I learned this particular bug happens when the unordered list is the last element in an editable region, say a table cell. A situation where an unordered list is the last element doesn't happen often, hence why I hadn't encountered it before. The workaround is to trick Outlook in thinking there is another element after the unordered list. Insert this code snippet directly after the closing </ul> tag:Β <div style="display:none;">&nbsp;</div>

Here's an example:

<p>Here is some text inside a paragraph tag</p>
<ul>
<li>List bullet 1</li>
<li>List bullet 2</li>
<li>List bullet 3</li>
</ul>
<div style="display:none;">&nbsp;</div>
Enter fullscreen mode Exit fullscreen mode

I hope this saves someone some time.

Top comments (3)

Collapse
 
zowiecanas profile image
zowiecanas

Amazingly simple fix for an issue that would have had me up all night looking for a solution. Big thankyou!!

Collapse
 
temach_ru profile image
Artem Chukanov

Love you man! It really works! So simply but soooo useful! And this trick really saved my time.
I saw that nobody thanked you yet and then deliberately created account here just to say THANK U.

Collapse
 
mdailey77 profile image
Matthew Dailey

You're welcome. I'm really glad you found it useful.

Update Your DEV Experience Level:

Settings

Go to your customization settings to nudge your home feed to show content more relevant to your developer experience level. πŸ›