Rounded Youtube Video - Smartphone

[Victor_Perret]

Hello everyone !
Something very strange is happening in my webflow adventure…
Here is my preview link : Webflow - Parions Sport

So on my webflow designer and on the chrome smartphone size (iPhone 12 Pro), my youtube video is perfectly rounded, cf screenshots :

But when it comes to reality and checking it on my smartphone, surprise surprise it is not rounded at all …
Here the result

Can anyone be of help here please ?
Thank you

[Pablo_Cortes]

Hello @Victor_Perret, this is a known issue with safari and IOS. Try this code to see if it fixes your issue:

<style>

.your-class {-webkit-mask-image: -webkit-radial-gradient(white, black);}

</style>

I hope this helps!

[Victor_Perret]

@Pablo_Cortes

<style>

.your-class {-webkit-mask-image: -webkit-radial-gradient(white, black);}

</style>

Hi Pablo !
Thank you for taking the time to answer, it is appreciated.
I am though a novice in coding through webflow, do I put it in the head or before body tag ?

[Victor_Perret]

@Pablo_Cortes

<style>

.your-class {-webkit-mask-image: -webkit-radial-gradient(white, black);}

</style>

PS : I think I made it …

[Pablo_Cortes]

hey @Victor_Perret you can put it in the head since it is a style tag, but you can also added in an embed element inside your page structure.