tjallingt/react-youtube

css class param is not passed to iframe

Opened this issue · 1 comments

I am using Next.js with Tailwind CSS

  "dependencies": {
    "next": "12.0.7",
    "react": "17.0.2",
    "react-dom": "17.0.2",
    "react-youtube": "7.14.0"

code:

        <YouTube
          className="object-cover w-full"
          videoId="ABCDEFGHI"
          opts={opts}
        />

With the above version css works however, with 9.0.1 I cannot see the classes applied. It is quite important especially if you use Hero element. Youtube overlays on edges and is not set to boundaries (object-cover).

@konradbjk version 9 introduced a breaking change. Changelog

In order to pass a class to the iframe, you need to use the iframeClassName prop instead of the className prop.