更改四开仪表板中标注块的宽度

Question

我想创建一个 Quarto 仪表板，其中我的 callout-block 的宽度与页面不同。现在它使用整个页面宽度，这不是我想要的。这是一些可重现的代码：

---
title: "Test"
format: dashboard
---

# Test

<h1>This is an example!</h1> 

I'm trying to change the width of my callout-block below!

::: {.callout-note}
Note that there are five types of callouts, including:
`note`, `warning`, `important`, `tip`, and `caution`.
:::

输出：

如您所见，它使用了仪表板的整个宽度。但例如我只想使用 30% 的宽度。我尝试使用一些像here所描述的CSS，但它对我不起作用。所以我想知道是否有人知道如何更改四开仪表板中此标注块的宽度？

Answer 1

您可以使用

!important

确保样式属性覆盖其他地方设置的任何其他属性：

---
title: "Test"
format: dashboard
---

# Test

<style>
.narrow {
    width: 40% !important;
}
</style>

<h1>This is an example!</h1> 

I'm trying to change the width of my callout-block below!

::: {.callout-note .narrow}
Note that there are five types of callouts, including:
`note`, `warning`, `important`, `tip`, and `caution`.
:::