How to provide classes to the video element?

[AndreasFurster]

We would like add a custom (Tailwind) class to the video element. In this case to let the video cover the entire div (object-fit: cover). Can we do this without js?

For example:

<media-player id="video1" class="aspect-square" src="" autoplay playsinline muted loop controls>
  <media-provider>
      <video class="object-cover"></video>
  </media-provider>
</media-player>

But when we use this code the video element is not used. Instead another video element is created.

We found the following solution, but we would like to attach a class directly to the video element instead.

<media-player id="video1" class="aspect-square" src="" autoplay playsinline muted loop controls>
  <media-provider class="[&>video]:object-cover"></media-provider>
</media-player>

PS: is there another way to cover the entire video + poster?