In Quarto/revealjs, why do calllouts influence which slide is shown in the Presentation panel (after rendering)?

[xalario]

Description

Hello,

(This question received no answer at the Posit community forum.)

With "Preview in Viewer panel" enabled rendering a Quarto/revealjs file shows the slideshow in the Viewer at a particular slide.

Usually, it is the slide on which the cursor is on in the *qmd file. I find this very convenient because the cursor is typically left at the slide that has been edited last.

However, this is not always the case. Oftentimes, the slide shown is one or more slides down the line. I find very cumbersome to have to click and navigate back to see the slide I am editing…

After trial and error, I have traced down the behavior to the absence/presence of callout blocks. (There might be other reasons.)

In the minimal reproducible example below, the alignment between cursor position and slide-shown-after-rendering depends on the absence/presence of a callout on slide 2. To appreciate this, place the cursor on Slide 3 and render with/without the call-out block.

Any thoughts on why, or remedies please? Thanks!

---
title: "Untitled"
format: 
  revealjs:
    default

---

## Slide 1 Quarto

Quarto enables you to weave together content and executable code into a finished document.


## Slide 2 Callout 

::: {.callout-tip}
## Callout title
Some text
:::

<!-- Replace callout above by plain text to see the difference -->

## Slide 3 Filler slide 1

{{< lipsum 1 >}}

## Slide 4 Filler slide 2

{{< lipsum 1 >}}

[cderv]

I think this function is directly integrated inside RStudio IDE. @kevinushey do you know about "Preview in viewer Pane" inside the RStudio IDE and which code controls the behavior around it?

I don't think we have that in the VSCODE quarto extension. Just want to check before opening an issue in rstudio github repo.

[mcanouil]

There is "slide tracking" in VSCode/Positron, but I cannot reproduce a systematic weird behaviour in this case using the provided example.
It is known that slide tracking is not perfect.

Screen.Recording.2025-12-09.at.15.49.10.mov

One thing that could help would be to format properly the callout div, using the empty lines around the header and using level 3 to avoid slide level confusion.

::: {.callout-note}

### Callout title

Some text

:::

[cderv]

I can reproduce in RStudio IDE - I don't know for Positron or VSCODE

[mcanouil]

So this is pointing towards RStudio rather than Quarto CLI, but it might still be related to how it integrates with quarto preview.

[xalario]

I don't know for Positron or VSCODE

I do not know either.

One thing that could help would be to format properly the callout div, using the empty lines around the header and using level 3 to avoid slide level confusion.

This works for me. In my tests level 3 is more important that empty lines, but I will use both.

Note that the help documentation about callouts indicates level 2 and no systematic empty lines. I suggest editing it.

Thanks!

[mcanouil]

empty lines around headers, code blocks, lists, and other structural elements is a general markdown linting rule which has two main advantages:

1. It makes your code/text more readable.
2. It helps almost all Markdown parser poperly read your markdown

regarding the level heading, you see level 2, but it is clearly stated:

note that the first markdown heading used within the callout is used as the callout heading

You can also (still a workaround to make it work on RStudio), use the title attribute syntax also described in the documentation:

::: {.callout-tip title="Tip with Title"}
This is a callout with a title.
:::

[xalario]

Thanks for the useful clarifications.

(I was reading the help while focusing on revealjs usage, where level 2 defines the individual slides.)