Pause within a list leaves blank space between items in quarto reveal

Question

In Quarto markdown I am creating a revealjs presentation and I want a list in which the last item is shown after the others. If I put a pause within the list (or I put the last item within a fragment) I get extra space before the last item. This is a MWE:

---
format:
   revealjs:
      slide-transition: slide
self-contained: true
---

## List without pause
- First item
- Second item
- Third item

## List with pause
- First item
- Second item

. . .

- Third item

Is there a way to have the last item shown after a pause and with the same spacing as the others?

Answer 1

Just remove the bottom margins for the list when using them with "pause".

Also note that .pause class I have used for the slide that contains lists with pause.

styles.css

.pause ul {
  margin-bottom: 0 !important;
}

presentation.qmd

---
format:
   revealjs:
    css: styles.css
    slide-transition: slide
self-contained: true
---

## List without pause
- First item
- Second item
- Third item

## List with pause {.pause}

- First item
- Second item

. . .

- Third item

---

Answer 2

In Reveal.js presentations created using Quarto Markdown, you can achieve your desired result by using the incremental: true attribute within your list item, and then explicitly defining the pause using three dots (...) before the last item. Here's how you can modify your example to have the last item shown after a pause with the same spacing as the others:

---
format:
   revealjs:
      slide-transition: slide
self-contained: true
---

## List without pause
- First item
- Second item
- Third item

## List with pause
- First item
- Second item

. . .

- Third item

This will ensure that the last item is displayed with the same spacing as the others, and it will appear after a pause when presenting the slide.