nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

How to indent header levels in Confluence

Jeff23

My company has an internal Confluence wiki hosted on atlassian.com. I like to use the various header levels (Heading 1, Heading 2, Heading 3) to help make it easier to comprehend complicated technical documentations.

However, when viewing such documentation, while the headers do affect font size, they do not affect any kind of indentation. This makes it really hard to distinguish subsections, since everything is flushed left. How can I change it so that the various heading levels are indented (kind of like how it works in the Table of Contents macro)? Such as:

Heading 1 here
   Heading 2 is indented a little bit and wraps
   are also indented.

      Heading 3, same thing more indentation (and same
      wrapping behavior)

   Heading 2 again...

I suspect this is pretty easy, but I can't figure out if it's something I do on pages I create, something my Administrator does that applies to all pages ever created, etc. Thanks for your help!

Accepted answers

Davin Studer

What you need to do to indent the heading and content under that heading is highlight the heading and content and then click the indent button in the toolbar. The button looks like some horizontal lines with an arrow pointing right. There is no way to automatically do this ... especially with the OnDemand version. But it can be done manually very easily.

All comments

Mick Davidson_o2ws6w

Jeff,

Can you do this by customising the space's CSS?

https://confluence.atlassian.com/display/DOC/Styling+Confluence+with+CSS

Cheers.

Davin Studer

You can indent the header easily enough with css, but the content that goes under the header won't indent as it is not contained by the header. I think the best thing is a manual process.

Davin Studer

Mick Davidson_o2ws6w

Davin,

Neat idea! Thanks.

Andrew Hill_dkn6pb

Disagree with the above comment that this is best done as a manual process. A space stylesheet is a far better way to ensure automatic and consistent indentation throughout the space without users needing to remember what level of indentation to use.

It's also relatively simple to do. For example:

h2, h2 ~ *:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) {
     margin-left: 10px !important;
 }
 h3, h3 ~ *:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) {
     margin-left: 30px !important;
 }
 h4, h4 ~ *:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) {
     margin-left: 50px !important;
 }
 h5, h5 ~ *:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) {
     margin-left: 70px !important;
 }
 h6, h6 ~ *:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) {
     margin-left: 90px !important;
 }

Hananya Beck

This indent the header alone, but the content that goes under the header won't indent as it is not contained by the header.

Jose Fortes

Unfortunately, you cannot indent specific content if it is not a list.

This means that you cannot indent a heading and its related content, which is weird and makes the reading of long pages a bit difficult.

Davin Studer

I can do it in my 6.4.2 install. Doesn't look to me like they have changed that behaviour.

Jose Fortes

It would be nice to have the chance o having

h1 paragraph: with indentation according to H1
h2 paragraph: with indentation according to H2
and so on...

Hananya Beck_n279ef

This CSS is great and indent the header and the sub-content that goes under the header but i work with CLD version that not support custom CSS.

Welcome!

It looks like you're new here. Sign in or register to get started.

Quick Links

Find more posts tagged with

confluence

cloud

confluence-cloud