How to change title banner size in Quarto?

Question

I have the below qmd file with quarto html option title-block-banner: true. How do I modify the size of the banner to reduce width?

---
title: "Cars"
title-block-banner: true
format: 
  html:
    code-fold: true
    page-layout: full
    fig_caption: yes
---
::: panel-tabset 
## MTCars

```{r}
head(mtcars)

```
## Cars

```{r}
head(cars)

```
:::

Answer 1

You can do it in this way by modifying the default style:

Qmd-file:

---
title: "Cars"
title-block-banner: true
format: 
  html:
    code-fold: true
    page-layout: full
    fig_caption: yes
---

<style>

#title-block-header {
  margin-block-end: 1rem;
  position: relative;
  margin-top: -1px;
  height: 75px;
}

.quarto-title-banner {
  margin-block-end: 1rem;
  position: relative;
  margin-top: -30px;
  height: 85%;
}

</style>

::: panel-tabset 
## MTCars

```{r}
head(mtcars)

```
## Cars

```{r}
head(cars)

```
:::

Output: