Styling Vue Slot

Wrap the slot in a <div> and style the <div> instead:

<div style="...">
  <slot></slot>
</div>

If you really need to style the slot element, you can use CSS selectors like this:

<div class="wrapper">
  <slot></slot>
</div>

.wrapper > * {
  color: red;
}

You can pass a class from the parent like so:

In the component template:

<slot name="quoteText"></slot>

And when passing to the slot:

<p slot="quoteText" class="mb-md-100">Text</p>

Related