How can I align from bottom a background video? - Forum | JoomShaper
Awaiting an answer SP Page Builder

How can I align from bottom a background video?

Asked by Sylvia 5 years ago Last activity 5 years ago

How can I align from bottom a background video?
Thanks for your help.

10 replies

Rashida Rahman Staff

Hi there!

Are you talking about section background video? This background video generally occupies the whole space of the section!

Would you please describe it with screenshots? Your site URL would be better.

Best Regards

Sylvia Asked this

Usually, we set the background as window height, but in this case I need to show half of the video in row section at in a page using page builder pro. So I add the video but I can't see where can I set the video to show only half of the video but from bottom to top. Thank you

Rashida Rahman Staff

Hi,

Would you please share your site URL here and redirect me where you have the video background?

You need to use custom CSS to do that. Let me try with your site url.

Best Regards

Sylvia Asked this

Thanks for your help.

Sylvia Asked this

I already sent you the exact url

Sylvia Asked this

I already sent you the exact url. Thank you

Sylvia Asked this

Hello, I wish to know if someone could help me wth my trouble. Thank you.

Pavel
5 years ago · edited

Hi. It is not possible to apply alignment to the video background. CSS does not have properties for this.
If you want to show half of the video, prepare it in a video editor, and then upload to the site.

Sylvia Asked this

The css properties shows a background-position 50% 50% but I can't find where can I edit this position in order to fixed the video position. Thank you.

Pavel
5 years ago · edited

The css properties shows a background-position 50% 50%

These are properties for image / color background-image or background-color, but not for video. You can try to change it right in the code inspector to make sure it does not have any impact. Video background (background-video) does not exist in CSS. Therefore background-position property cannot be applied to it and you can not manage it. This is just so called, in fact it is not a background as an image or color, but a block with video tag inside, that is positioned absolutely or fixed with a smaller z-index. There is no way to align or cut video in it. You just have to prepare the file you want - it's all you can do.

To understand how it works, take a look at this tutorial.
https://www.w3schools.com/howto/howto_css_fullscreen_video.asp

Log in to reply.