how to change code block height and width in quarto presentation

Question

I am using quarto to make slides based on revealjs. I can not find options that can change code block height and width in the Guide.

In the example beleow maybe we can set like this although it is a wrong way.

```{r code_block code-block-width="135px" code-block-height="200px"}
some code here
```

An example is below.

---
title: "Untitled"
format: revealjs
editor: visual
---

## 
text text text text text

::: columns 

::: {.column width="50%"}
```{r code_block}
#| eval: false
#| echo: true

some code here
```
:::

::: {.column width="50%"}

```{r}
a = 1
b = 2
plot(a, b)
```

```{r}
a = 1
b = 2
plot(a, b)
```

:::
:::

Answer 1

You can use chunk option class-source and classes to do this.

Define css classes with height width as you need and then assign these classes to both the chunk options class-source and classes to have specific height & width for that source code chunk.

---

---
title: "Untitled"
format: revealjs
editor: visual
---


```{css, echo=FALSE}
.my_class1 {
height: 200px;
width: 100px;
}

.my_class2 {
height: 100px;
width: 200px;
}
```



## text text text text text

::: columns 

::: {.column width="50%"}


#### larger height and samller width

```{r}
#| eval: false
#| echo: true
#| class-source: my_class1
#| classes: my_class1

"some code here"
```

#### samller height with larger width


```{r}
#| eval: false
#| echo: true
#| class-source: my_class2
#| classes: my_class2

"some more code here"
"some more code here"

```

:::

::: {.column width="50%"}

```{r}
a = 1
b = 2
plot(a, b)
```

```{r}
a = 1
b = 2
plot(a, b)
```

:::
:::

---