Hey there! Is it possible to change the aspect ration of videos to a vertical aspect (9:16)? It’s very to do in Elementor. Hoping to be able to do this to display Shorts. Thank you!
Hey Graham,
Welcome to the forum!
As already answered via email: Currently, there is no setting for aspect-ratio.
Aspect ratio is a CSS one-liner, so you could use a class or add this to the custom CSS field of the video element:
root {
aspect-ratio: 9/16;
}
However, I’m not sure if the video element will behave correctly then.
Best regards,
timmse
Something weird happend. I placed
%root% {
aspect-ratio: 9/16;
}
In the video element and it worked (I am using vimeo) in the backend and front ent, even when not logged in. I now pasted in a new vimeo url and suddenly, the aspect ration is not working anymore. Even if I place the previous vimeo url.
Hi again
Just following up on this because I’m honestly stuck and hoping someone here might have a deeper idea what’s going on.
As I mentioned, I had placed aspect-ratio: 9 / 16; on the root level of the video element (not just the container), and it worked — even in the front end when logged out. But when I simply changed the Vimeo video URL (nothing else), the aspect ratio broke. Even switching back to the original URL didn’t fix it.
Since then, I’ve tried multiple things:
Embedding the video via Bricks Video element (using the direct media link)
→ works but always forces fullscreen playback on mobile – and no way to prevent that- Hosting the video via Bunny.net, using a raw
<video>tag +poster
→ video plays inline, looks good
BUT: only small native browser controls, and no prominent play button on desktop - Manually adding a custom play button via HTML/CSS/JS
→ button shows up, plays the video
BUT: aspect ratio breaks again – the video appears as 16:9 inside the 9:16 container
I even wrapped it in a properly styled container with aspect-ratio: 9 / 16
→ no difference, it keeps defaulting to horizontal
I also tried playing around with:
object-fit: contain/cover- inline styles on the
<video>tag - different hosting links (MP4, HLS)
It honestly feels like I’m fighting ghosts at this point. 
If anyone here has successfully embedded a vertical video (9:16) with custom controls or buttons in Bricks, I’d really appreciate any insight.
Thanks in advance for any tips 
(I’d even be happy with a completely different approach at this point, as long as it works on mobile and desktop.)
The most simplestestest solution would be very welcome. Literally, this video is the last thing, I need to place on this page before doing final touches to the responsiveness. But this (what should be super easy thing) is wasting hours by now. 
It worked for me to put aspect-ratio in the container of the video AND overflow: hidden. It’s magic 
Thank you for the tip!