Help with styling the React.js video player

1

I was playing around with the video player on react.js and I am having a hard time trying to figure out how to apply className to the component to make it style with my tailwind css framework and make it mobile-first. Any insight would be appreciated.

2

Hello @nickscape96!
It’s not currently possible to apply a className directly to the api.video React player component, you need to apply styles through its style property.

Otherwise, you can target child elements with TailwindCSS to style your video. Here’s an example:

<div className="[&>div]:h-24 [&>div]:w-28 [&_iframe]:[position:relative!important]">
  <ApiVideoPlayer video={{ id: 'VIDEO_ID' }} />
</div>

Feel free to reach us again if you need anything else :slight_smile:

3

User can’t apply className directly to api.video React Player Netflix Mod Download Free component. They should use the style property or target child elements with TailwindCSS.