Remove Bullet List Indents

I built a template by exporting one that was designed with the built-in designer.  I'm trying to remove the indent spacing on bulleted lists but can't seem to get it to work the css I'm modifying is below.  I've tried adding 0px left margin and 0px left padding...

.article-content ol, .article-content ul { margin-top:0px; margin-bottom:18px; padding:0; }
.article-content li { font-size: 11px; line-height: 18px; color: #444444;}
.article-content li a { color: #B56C0D; text-decoration:none; }

Thanks in advance for any help on this.

torweb, 4 years ago
torweb :

I built a template by exporting one that was designed with the built-in designer.  I'm trying to remove the indent spacing on bulleted lists but can't seem to get it to work the css I'm modifying is below.  I've tried adding 0px left margin and 0px left padding...

.article-content ol, .article-content ul { margin-top:0px; margin-bottom:18px; padding:0; }
.article-content li { font-size: 11px; line-height: 18px; color: #444444;}
.article-content li a { color: #B56C0D; text-decoration:none; }

Thanks in advance for any help on this.

Also, adding a negative value to margin-left will remove the indents in the preview mode however in the edit mode the bulleted items are far left almost off the page....

dedra dedra, 4 years ago
torweb :
torweb :

...
.article-content ol, .article-content ul { margin-top:0px; margin-bottom:18px; padding:0; }
...

Also, adding a negative value to margin-left will remove the indents in the preview mode however in the edit mode the bulleted items are far left almost off the page....

Hi, for edit mode, you must add ".cs-el-wrap" class to your CSS classes like:

.article-content ol, .article-content ul, .article-content .cs-el-wrap { margin-top:0px; margin-bottom:18px; padding:0; }

or maybe like:

.article-content ol, .article-content ul, .article-content ol .cs-el-wrap, .article-content ul .cs-el-wrap { margin-top:0px; margin-bottom:18px; padding:0; }

Because I do not know what it looks like your code, please try, what option is correct for you.

torweb, 4 years ago

My fix was li{margin-left:-20px !important;}

FYI

torweb, 4 years ago

However my fix removes the bullets for Outlook 2007 - 2010 :-(

Need help again

dedra dedra, 4 years ago
torweb :

However my fix removes the bullets for Outlook 2007 - 2010 :-(

Need help again

Hi, from one forum:

List styles are ignored: no images for bullets, no square bullets, no lists without bullets.
Workaround: close your eyes and count to 10. If you don't want bullets to appear - use paragraphs instead of lists.
Padding for lists is ignored.
Workaround: use margins whenever possible.

... and from another:

Outlook does not support CSS for <ul> list type, the Bullet points are ripped off..

You can instead use a table to design the same and for the Bullets you can use-  &bull;  in one of the <td> and in the next <td> have your Text Written...

This is the only solution to have bullet points seen in your outlook Emails

Enjoy

Join 150,000 companies around the world that use Campaign Monitor to run email marketing campaigns that deliver results for their business.

Get started for free
1-888-533-8098