revealjs - find a way to correctly support vstack / hstack layout

[cderv]

Something like this

## Quarto Workflow

::: {.r-vstack}

![](images/rstudio-qmd-how-it-works.png)

![](images/qmd-how-it-works.png){.fragment}

![](images/ipynb-how-it-works.png){.fragment}

:::

Should be supported to have a nice layout per

quarto-cli/src/resources/formats/revealjs/reveal/css/layout.scss

Lines 35 to 57 in 351ba4f

	// Horizontal and vertical stacks
	.reveal .r-vstack,
	.reveal .r-hstack {
	display: flex;
	img, video {
	min-width: 0;
	min-height: 0;
	object-fit: contain;
	}
	}
	.reveal .r-vstack {
	flex-direction: column;
	align-items: center;
	justify-content: center;
	}
	.reveal .r-hstack {
	flex-direction: row;
	align-items: center;
	justify-content: center;
	}

from revealjs. It is not documented at https://revealjs.com/layout/ though

But it is in the examples : https://refined-github-html-preview.kidonng.workers.dev/hakimel/reveal.js/raw/master/examples/layout-helpers.html

It is not working because like with .r-stretch it works when img are inside the div directly

<div class="r-vstack">
  <img width="450" height="300" src="...">
  <img width="300" height="450" src="...">
  <img width="400" height="400" src="...">
</div>

but pandoc is adding a <p>

<div class="r-vstack">
  <p><img width="450" height="300" src="..."></p>
  <p><img width="300" height="450" src="..."></p>
  <p><img width="400" height="400" src="..."></p>
</div>