Bulletted formatting under Description for Catalog Items

Winnie P
Mega Sage

Hello There - Is there a reason why bulletted formatting does not line up ie, under Description when creating a Catalog Item. Is it possible to line up bullet points? Thank you.

find_real_file.png

1 ACCEPTED SOLUTION

Willem
Giga Sage
Giga Sage

In the backend I see it aligns different:

find_real_file.png

Based on this Stackoverflow post:

https://stackoverflow.com/questions/11556493/second-line-in-li-starts-under-the-bullet-after-css-res...

 

you can do the following:

find_real_file.png

 

Then add styling:

find_real_file.png

(change <ul> to <ul style="list-style-position: outside; margin-left: 1em;">)

 

The result:

find_real_file.png

View solution in original post

12 REPLIES 12

Ashutosh Munot1
Kilo Patron
Kilo Patron

Hi,

I think that is OOB behavior as this is render from widget script.


Thanks,
Ashutosh

Brad Bowman
Kilo Patron
Kilo Patron

Hi Winnie,

If there is a reason this is the default, I don't know what it would be other than an oversight, or someone's personal preference.  You can change this pretty easily.  On the HTML field in question, such as Description on the Catalog Item form, click the Source code icon <>.  You'll see your unordered list defined like this by default

<ul style="list-style-position: inside;">

All you have to do is change this line to something like this

<ul style="list-style-position: inside; text-indent: -1.4em;">

You can tweak the -1.4 number depending on your preference and the font used - different bullets/fonts will require more or less space for the indent of wrapped rows, which is likely why they left it not indenting to begin with.  I hadn't noticed this before - we might not have any verbose bullets, but I'll be checking/correcting them all now.  Get out your ruler and enjoy the harmonious alignment!

Thank you Brad, this worked. I have also replied to Willem below who had the same solution as yourself.  I also added another query to his reply.  Cheers.

Willem
Giga Sage
Giga Sage

Hi Winnie,

I tested this in the Service Portal and looks like this:

find_real_file.png

 

This is aligned as you described right (line up bullet points). This is default Service Portal in Orlando.

 

Can you share a bit more information where your screenshot is from? And what caused this?