Brooklyn Theme: Video height is cut off after reducing padding below Header

Topic summary

Issue: After adding a background video to the Brooklyn theme using custom code from ecomexperts.io, reducing the space (padding) below the header causes the video’s height to be clipped, cutting off bottom text.

Details:

  • The video initially displayed correctly before padding adjustments.
  • The site link was shared, but the helper couldn’t see a video on the live homepage.

Actions taken:

  • The store owner reverted the change on the live site and provided a preview link to demonstrate the issue.
  • The request is to adjust the video-background height so the bottom text is not cut off.

Key links:

Status: No solution provided yet. The thread is open, awaiting guidance on CSS/layout adjustments (e.g., video container height or padding) to prevent clipping.

Summarized with AI on February 4. AI used: gpt-5.

Hello!

I just added a Video Background using custom code from https://ecomexperts.io/blogs/liquid-tutorial-shopify/background-video

The video displayed perfectly, but after I reduced the space between the header and the video, the video height is cut short. How can I correct this? https://mamantra.co/

Thank you so much!

1 Like

@DowntownDebbie

oh sorry but i can’t see home page any video section can you show me

Sorry, Ketan, I ended up reverting it so that it won’t display on Live. Here’s the preview link to the video. Thank you! I’m just looking to edit the height of the video-background so that it won’t cut off the bottom text. Thank you!

https://8tjnyw0rxb32h2v4-60018589940.shopifypreview.com

Sorry, Ketan, I ended up reverting it so that it won’t display on Live. Here’s the preview link to the video. Thank you! I’m just looking to edit the height of the video-background so that it won’t cut off the bottom text. Thank you!

https://8tjnyw0rxb32h2v4-60018589940.shopifypreview.com