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; } } }

Indenting a macro

Ramsay Mayka1

Macros like Code Block and Info appear to always be aligned with the left margin, but I would like to indent them.

I have text that is formatted in indented paragraphs and I want to use the Info macro to highlight the next paragraph but it should keep the same alignment.

I am able to achieve something like this by defining a section and columns, but it feels like a hack. Are there other alternatives

Accepted answers

All comments

Matthew J. Horn

Any solution will be "a hack" if you're styling the output of a macro that does not take style parameters. That being said, there are some ways to achieve this without being too invasive. The primary way I would do it is define a custom style in CSS for the macros that you want.

For example, insert a Code Block macro in your page and then view the output. You'll notice that it's inside the following div:

As a result, if you add something like the following to your CSS, you should achieve proper indentation:

div.code.panel {

margin-left: 100px !important;

}

Ramsay Mayka1

Would your suggestion result in the all code blocks (within the space which uses the CSS) being indented by 100px?

Part of the problem as I see it is that the macro closes the current (indented) paragraph rather than inserting within the paragraph.

KM4

Make a panel macro around the macro to be indented, like this:

this is code block text

(Set Border Color to #FFFFFF or white.) However, that produces 0,5" or so too much space above the macro (and slightly too little indentation for my purpose). Are there any better solutions?

Indent macro does not allow macros inside. Could somebody please write an Indent1 macro that does allow macros inside and either an indentation parameter or spaces before the Indent1 macro? Or better, the two macros suggested here: https://jira.atlassian.com/browse/CONF-38096

Anyway, Atlassian should allow macros like Code Block or Page Tree appear within text. That way I'd just need to add some spaces before them to get the indent. (also mentioned in https://jira.atlassian.com/browse/CONF-38096)

Peter Akey

Working off @matthew's suggestion, I have found that just doing a DIV with an inline style works for me.

<div style="margin-left: 30.0px">

<codeblock>

</div>

P tags with the same style around code macros get stripped when saving your changes but the DIV tags don't. At least not yet...that may change or your mileage may vary.

Christopher Nielsen

Thank you. This works great.

Mikael Mikkola

How do you add a div on the page?

Peter Akey

Edit the "HTML" of the content by clicking the "<>" icon in the upper right and just type it in:

<div style="margin-left: 90.0px;">This is a div with a left-margin</div>

Charlie Demsky

What I've done is create the code block, create a bulleted list directly above the code block, copy/paste the code block onto the bulleted list, delete the original code block. Kind of hacky and it does add a bullet before the code block, but it works.

Michelle Rau HP

I was able to indent the "expanding text" macro by using a snippet of CSS as follows. This affects all the expanding text macros on the page.

.expand-control-icon {
  margin-left: 58px;
}

unknown

I used a Section with a spacer Column:

This is what it looks like:

Rolland_Vandersluis

That was most helpful for the localized macro indents. It still blows my mind that Atlassian is so early 1990s about such basic formatting needs. :-(

unknown

The "Answer" at the top of this Question is outdated.

This solution works perfectly with the current Confluence structure. Thank you!

Welcome!

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

Quick Links

Find more posts tagged with

confluence