NW
0
Space Between <li>
What's the best way to add space between bulleted items? Bottom padding works on all clients except Outlook and Gmail. Is there a workaround?
What's the best way to add space between bulleted items? Bottom padding works on all clients except Outlook and Gmail. Is there a workaround?
Hi Nancy,
In the past I have had trouble with lists not aligning properly so I had to find an easier way of building bullet points. I have been using a table with two columns. The left column with the bullet points and the right column with content. Below is a snippet of code that i have been using for sometime.
Using this method you will be sure the alignment and spacing around bullets and text will be the same on all devices.
Hope this solution is easier for you.
Cheers
Cool idea! It worked to get the spacing between bullets on ALL email clients, BUT the bullets disappeared on gmail, aol, and android. Thanks for your help.
Try bull instead of the one I put above.
That did it! Works perfectly on every single client. Thank you so much for the excellent tips!
No problems. Am happy it worked for you.
In addition to M Shameer, use inline css
color:#444444; for both • and content (color code upto you)
Quick note on lists
If you add margin to the
<ul>or<ol>tag then Outlook will change the code into a series of<p>tags and will give inconsistent rendering. If you don't add margin it will render as a list and have pretty consistent rendering.Did you try using Margin-bottom, this seems to work for me on outlook and gmail
I thought I had tried that, but apparently not. It worked perfectly on Outlook, but not Gmail. I'll take it! It's for a company email that uses Outlook. Thanks Brandon!