Create
cancel
Showing results for 
Search instead for 
Did you mean: 
Sign up Log in

Next challenges

Recent achievements

  • Global
  • Personal

Recognition

  • Give kudos
  • Received
  • Given

Leaderboard

  • Global

Trophy case

Kudos (beta program)

Kudos logo

You've been invited into the Kudos (beta program) private group. Chat with others in the program, or give feedback to Atlassian.

View group

It's not the same without you

Join the community to find out what other Atlassian users are discussing, debating and creating.

Atlassian Community Hero Image Collage

Formatting Nested Lists

I am creating a CSS file to format a space in Confluence. I'm trying to format a nested list. When I set the font size to 1.5em, the font in the nested list is bigger than the list. Here's an example:

  • List Item 
  • List Item
    • Nested List Item - (The font is bigger than the List Item)
    • Nested List Item - (The font is bigger than the List Item)
  • List Item 
  • List Item

I'm not sure why this happens but it's consistant. The Table of Contents at the top of the page renders the same way. 

2 answers

Hi @Paul Cartee ,

Welcome to the community!

It is actually possible to do this through the normal editor mode. Let me try to explain this

  1. Create the numbering first
  2. In the second line, use the "tab" button so that the cursor moves inward
  3. Confluence would use numbering when you move the cursor inward
  4. Change it to "bullet point" by clicking the option

That should do it. I know it's a bit confusing!

also check out this documentation https://confluence.atlassian.com/confkb/how-to-have-nested-number-lists-in-confluence-757465539.html

0 votes

You miss understood what I was asking. The problem is, when I apply my CSS file to a page with a nested bulleted list, the second level of the bulleted list has a font size larger than the first level of the bulleted list, and the 3rd level of the nested bulleted list is larger than the 2nd level. It appears that Confluence keeps increasing the size of the font with each level of the list. 

See the screenhot below for an examle. 

bulleted list example.png

This only happens when I use a CSS file. My question is, how do stop this from happening? I increased the font size for <ol> and <ul>. The 1st level renders correctly, but 2nd and 3rd levels render incorreclty. I tried to increase the font size of only <li> and it reneders the same way. The 2nd and 3rd level font sizes are always larger than the 1st level font size. 

Suggest an answer

Log in or Sign up to answer
TAGS
Community showcase
Published in Trello

📹 Favorite Trello templates

Hello Community!  My name is Brittany Joiner and I am a Trello enthusiast and Atlassian Community Leader. In this video, I'll share my favorite Trello templates. Templates mentioned in ...

75 views 4 5
Read article

Community Events

Connect with like-minded Atlassian users at free events near you!

Find an event

Connect with like-minded Atlassian users at free events near you!

Unfortunately there are no Community Events near you at the moment.

Host an event

You're one step closer to meeting fellow Atlassian users at your local event. Learn more about Community Events

Events near you