[Support request] How to add shadow to a video

[Sam]

Greetings:

Please advise how to add shadow to a video on all 4 sides in GP theme’s css.

I found the following code somewhere online however I am not sure what should replace “.custom-single-training-media” in the CSS.

.custom-single-training-media {
box-shadow: 0px 3px 17px -3px rgba(0,0,0,0.36);
-webkit-box-shadow: 0px 3px 17px -3px rgba(0,0,0,0.36);
-moz-box-shadow: 0px 3px 17px -3px rgba(0,0,0,0.36);
}

I look forward to your response.

Thank you.

[David]

Hi there,

edit your HTML video element so it includes a class eg.

<video class="has-shadow" .... your other attributes ....

Then you can add your CSS to that class eg.

.has-shadow {
    box-shadow: 0px 3px 17px -3px rgba(0,0,0,0.36);
}

[Sam]

Thank you very much.

How to make sure the shadow appears on all sides? I understand this is more of a CSS question that a theme one.

[David]

Give this site a go to create your own shadow properties:

https://www.cssmatic.com/box-shadow

[Sam]

Many thanks.

[David]

You’re welcome

[Author]

Posts