Hello, I have a custom liquid section in my theme where I have a code that displays a video from shopify files. The video is not full with as my other images etc so I would very much like to fix this, it is probably very easy for someone who knows how to code. I will attach a screenprint from my mobile with the video so you guys can see what I mean. 95% of my customers come from smartphone so thats the most important.
To help you with this issue, I can provide you with general guidance and recommendations based on the code you shared:
Remove the fullscreen attribute: The fullscreen attribute is not a valid attribute for the <video> tag. You can remove it from the code.
Update the CSS: The CSS code you provided should make the video fill its container, but it’s important to ensure that the container itself has the appropriate dimensions and is set to full width. Here’s an example of how you can modify the code:
In this code, a container div with the class video-container is created to wrap the video element. The container is set to full width and maintains its aspect ratio using the padding-bottom property. The video is then absolutely positioned within the container and set to cover the entire area.