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 do you add an image on a separate line in a step-by-step guide?

Dave Counts_8jfs6s

I'm creating a step-by-step guide and including screenshots. I want the screenshot to be below the text, but when I hit enter it also adds another step number.

It looks weird having an image right next to the text, but I don't want the image to be its own step.

Please help!

Accepted answers

Mikael Sandberg

Hi Dave,

Welcome to the Atlassian Community.

You can use Shift+Enter to add a new line without adding a new step number.

All comments

Mikael Sandberg

Hi Dave,

Welcome to the Atlassian Community.

You can use Shift+Enter to add a new line without adding a new step number.

Dave Counts_8jfs6s

That did it. Thanks!

Thomas Bowskill

@Dave Counts , one other option to consider for step-by-step guides is using the Page layout (with Panel macro to give boarders), which helps when you have lots of steps and relatively small screenshots.

e.g. here is a step-by-step guide we have where we're using the 3-column page layout and Panel to reduce the downwards scroll. Step numbers have to be done manually here (so I'm not answering your question at all -- just sharing something useful I have found!)

Dave Counts_8jfs6s

Thanks Thomas. I'll check it out. That would definitely come in handy for longer guides!

udith perera

https://community.atlassian.com/t5/Confluence-questions/Pasting-an-image-the-bullet-is-on-the-bottom-side-is-it-possible/qaq-p/1322329