I´m using Elementor to embed the JS code for the Cloudflare stream player (using the Elementor HTML code widget). The player pops up and the video plays but the controls are only half visible, the buttons don´t really work, the mapping of the clickable area seems misaligned (for example, clicking on the settings wheel makes the video go full screen)
I´ve replicated this with 3 different videos, including Cloudflares own API manual example (see below)
I have tried several different videos, including Cloudflares own sample video. I have checked the code in view source on the served webpage is exactly the same as the embed code in the streaming page on Cloudflare.
Yet, the problem persists. I supected that this is an Elementor issue, so I created a regular Wordpress page and embedded the code. Still the same. So my best estimate right now is that it’s a Wordpress problem. This has nothing to do with formatinng. This happens even when I put it on an otherwise empty page with no formatting.
With a URL a web developer can find the parent element of controls via browser Inspect Element dev tool and investigate from where it gets the attributes and find a fix. This is not a Cloudflare issue and you will find a solution faster by asking at http://stackoverflow.com.