SOLVED: Video background does not display in full width

Bricks Version: 1.3.5
Browser: Chrome
OS: Windows
URL:Home Page New - Oμοιοπαθητικός Μαργαρίτα Σέγκου BSc (Hons) | Αθήνα, Ηράκλειο

I try to rebuild a page with bricks and when I try to set up a video background it does not display properly in full width.

Also in mobile does not display in full High.

Please check the screenshots:

Any help please?

Felix

1 Like

Hi @Felix

Welcome to the forum :+1:

Have you tried changing the video scale? See image attachedScreenshot_110

1 Like

Hi Eftychios,
Welcome to the forum!

@Michael is right, please increase the scale value. A value of 2 will work perfectly on my 32" 4k display (which is reaaaaaally huge) :slight_smile:

Best regards,
timmse

Thank you all.

It is a partial solution thought because the video gets too zoomed in and in certain screen sizes does not look as good as it should.

Can we have the video adjust according the screen size, working like the “cover” mode in photo backgrounds?

Unfortunately not. On smaller screens, especially on mobile, it´s maybe even better to get rid of the video and use a background image instead.

Previously, this website used slider revolution that managed background video as cover.

Does bricks builder lacks this feature or is it something else that does not allow video to be used in “cover” mode as background?

It isn´t supported at the moment. But you can override the video behavior with custom css as a last resort. There are a lot of examples on codepen like this one, which should also work within bricks (if you change the classes accordingly).

Thank you, I will give it a shot and let you know.

Can I also submit it as a feature request for next updates?

Sure, you can always submit your ideas to the idea board: Ideas – Bricks
If there are a lot of upvotes, it will be implemented :slight_smile:

Ps: Check this example as well. It will lead you to something like:

root {
  overflow: hidden;
}

root .bricks-background-video-wrapper {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 200%; /* Adjust this between 150% and 200% */
  min-height: 200%; /* Adjust this between 150% and 200% */
  width: auto;
  height: auto;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  transform: translate(-50%, -50%); 
}
1 Like

Hi Eftychios,

just to let you know: we improved the background video option in Bricks 1.3.6 (which is available now) to display the background best possible. From now on, you can even choose an aspect ratio for your background videos that will help to scale them without squeezing them, so they look good in every scenario.

Please give it a shot and let me know what you think :slight_smile:

Happy weekend,
timmse

Thank you so much!

Looks fantastic.

Keep up the good work!

1 Like

I think this will probably be one of the underrated improvements from 1.3.6!

This was probably only one of a very small handful of features that I have felt was a little off (half baked). But now it works brilliantly like what you would expect of it from bricks!

:clap: :partying_face: :clap:

1 Like