Come for the products,
stay for the community

The Atlassian Community can help you and your team get more value out of Atlassian products and practices.

Atlassian Community about banner
4,369,285
Community Members
 
Community Events
168
Community Groups

Different bullet for multi-level bullet list (nested bullet list)

Edited

Problem: In my Confluence version, a black dot is used as the default bullet for every level in the multi-level list. It is very difficult to differentiate levels in a document. 

I want to change the list to this:

  • level 1
    • level 2
      • level 3

Solution: Insert this CSS code into your Page / Global Stylesheet:


.wiki-content ul li { list-style: disc; }
.wiki-content ul li li { list-style: circle; }
.wiki-content ul li li li { list-style: square; }
.wiki-content ul li li li li { list-style: disc; }
.wiki-content ul li li li li li { list-style: circle; }
.wiki-content ul li li li li li li { list-style: square; }

Save and that's it! You can also customize the type of bullet by changing disc, circle, ... into something else. See more info here: https://www.w3schools.com/cssref/pr_list-style-type.asp

Note: To know how to get to the Stylesheet, see https://confluence.atlassian.com/doc/styling-confluence-with-css-166528400.html

Edit: Also, each "li " correspond to a level. E.g: li li  means you are changing bullet at level 2. You can add more line if you want to config bullet type at deeper level

0 comments

Comment

Log in or Sign up to comment
TAGS

Atlassian Community Events