Vignette (inset shadow) on a video
I am struggeling with putting up a vignette (shadow being inset) to a video-tag in html5.
Things I was trying to do:
- Put a box-shadow on the video-tag itself
- Put the video tag inside a div and give that div the box-shadow
- Put a div after the video tag and give it the box-shadow (I was referring to a stackoverflow thread: https://stackoverflow.com/questions/26786940/can-you-have-css-box-shadow-inset-show-on-video-element)
Nothing of those seem to work or just work kind of, but not as expected. I'd like the vignette to be only visible at the bottom, and blur out like 20% of the height.
A codepen I was trying to mess with (I put up a box-shadow on any element, cuz why not):
https://codepen.io/Proudyy/pen/eYjBewO
Things I was trying to do:
- Put a box-shadow on the video-tag itself
- Put the video tag inside a div and give that div the box-shadow
- Put a div after the video tag and give it the box-shadow (I was referring to a stackoverflow thread: https://stackoverflow.com/questions/26786940/can-you-have-css-box-shadow-inset-show-on-video-element)
Nothing of those seem to work or just work kind of, but not as expected. I'd like the vignette to be only visible at the bottom, and blur out like 20% of the height.
A codepen I was trying to mess with (I put up a box-shadow on any element, cuz why not):
https://codepen.io/Proudyy/pen/eYjBewO
Stack Overflow
I added a box shadow to a <div> and added a <video> element to the div.
The box shadow shows up on the div, however it doesn't affect the video element.
Is this the expected behaviour, ...
The box shadow shows up on the div, however it doesn't affect the video element.
Is this the expected behaviour, ...
A friendly place for developers to meet other devs, ask questions, get help, and just have a good time 🙂.
36,263Members
Resources
Recent Announcements
Similar Threads
Was this page helpful?
