How to apply text alignment in different formats like pdf and html?

[luifrancgom]

Description

Description

I want to apply text alignment in different formats like pdf and html.

Minimal reproducible example

I tried the following:

---
title: "Text alignment"
format: 
    html:
        embed-resources: true
    pdf: default
engine: knitr
---

```{css}
#| echo: false

.signature p {
  text-align: right;
}
```

::: {.content-visible when-format="pdf"}
\begin{flushright}
Some text align to the right in pdf
\end{flushright}
:::

::: {.signature .content-visible when-format="html"}
Some text align to the right in html
:::

I get the expected behavior in pdf but I am not able to do the same in html. I don't know if I am not doing it in a correct way or if there is an alternative way to specify multiple classes in html for Quarto in a div to align the text and that works for multiple formats.

Additional information

• Quarto version: 1.8.14
• OS: Windows 11

[mcanouil]

Nest the divs.
.content-visible when-format="html" is special. It's not attributes to the content, it's special markup for Quarto.

[luifrancgom]

Thank you. For someone who needs more information check out Div:

---
title: "Text alignment"
format: 
    html:
        embed-resources: true
    pdf: default
engine: knitr
---

```{css}
#| echo: false

.signature p {
  text-align: right;
}
```

::: {.content-visible when-format="pdf"}
\begin{flushright}
Some text align to the right in pdf
\end{flushright}
:::

:::::: {.content-visible when-format="html"} 
::: {.signature}
Some text align to the right in html
:::
::::::