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 I create nested paragraphs inside lists?

Timo

I want to create a nested paragraph under a list item so that the paragraph is aligned with the list item text indent but carries no bullet or number. In essence, I want to create the equivalent of Microsoft Word's List Continue paragraph, which is for list items that take up multiple paragraphs.

The only way of doing this that I've found – while still keeping the list intact – is to insert a manual line break in the list item. However, this feels like hacking (since manual breaks of any kind should be a no-no in cleanly formatted and styled content) and also presents problems with paragraph-level formatting (since the manually split lines seem to be all one and the same paragraph).

Is there another, cleaner way of doing this?

Accepted answers

Anne EQS

Coffee
Tea
Black or green - this is a paragraph
Milk

How to do this? - I used the source code editor, but haven't found a way to do it without.

<ul>
  <li>Coffee</li>
  <li>Tea<p>Black or green - this is a paragraph</p>
  </li>
  <li>Milk</li>
</ul>

All comments

Rodney Hughes

Try this

you have a list
with several lines in a point
at the end of the previous line,
press enter
then on the next line where another bullet has been created,
just press the backspace key once ot remove the bullet on that line.

Or instead of pressing enter at the end of the line, press Shift + Enter

Timo

Those are the two methods I've already discovered. But both (seem to) result in a manual line break, which is not a clean approach for structuring and styling content. I'd like to be able to create a new indented paragraph that (a) is an independent paragraph-level block of content and (b) does not break the list.

Anne EQS

Coffee
Tea
Black or green - this is a paragraph
Milk

How to do this? - I used the source code editor, but haven't found a way to do it without.

<ul>
  <li>Coffee</li>
  <li>Tea<p>Black or green - this is a paragraph</p>
  </li>
  <li>Milk</li>
</ul>

Timo

I definitely preferred the markup editor over the WYSIWYG editor back when the former was still available in Confluence. I don't recall having my present list item issue back then, so it's nice to know there's at least a plugin for working directly with the source.

Thank you!

Maggie Secara1

I've never found a way to do this. Usually what I want to do is put a screen shot between two numbered steps, and the only way to do it is with manual line breaks, or by just typing the numbers manually. You lose the hanging indent, but it's better than sometimes long strings of "Step 1".

The source code editor seems to be brilliant solution, even if I never use it for anything else.. Thanks for that!

Toàn Đoàn Mạnh

You can actually do this with Markup Editor (open by press Ctrl + Shift + D), and try something like this

* List level 1

** List level 2

Paragraph block

** List level 2

Paragraph block will be indented same as list level 2, with no bullet. Make sure there are no line break between these lines.