Home New Guten Forums WoodMart support forum Woodmart video widget overlaps with section below on mobile

Woodmart video widget overlaps with section below on mobile

Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • #648150

    kontakt-9949
    Participant

    Hello, I want to add youtube videoes to my product description, but when I use the woodmart video widget it overlaps with the section below on mobile devices. Why is this happening? I have found the css that is causing the problem, but dont know how to fix it without affecting the rest of the site. Please help me out. Looking forward to hearing from you.

    Attachments:
    You must be logged in to view attached files.
    #648647

    Hello,

    The issue you’re experiencing appears to be related to responsiveness — specifically with the layout on mobile devices. The YouTube video itself is loading correctly, but it’s overlapping with the section below due to the lack of spacing.

    To resolve this, you’ll need to adjust the “Maybe You Like Too” container in Elementor:

    Edit this with Elementor > Select the section or container for “Maybe You Like Too”.

    Go to the Advanced tab > Switch to the Mobile view (responsive settings) > Add some top padding to create space above this section.

    This should prevent the video from overlapping on mobile without affecting the desktop layout.

    Best Regards,

    #649144

    kontakt-9949
    Participant

    Hello Aitaz,

    This is a workaround that does not even work I am afraid. The space between your video widget and the section below is changing in tact with each other for every pixel. So this is not an option. Why does it happen with your video widget when it does not happen with say a standard elementor widget? Please solve this, it really is a big problem. I need this bug to go away.

    Thank you.

    #649196

    Hello,

    Sorry to hear about the inconvenience. Kindly please share your Site WP-ADMIN Login details in the Private Content field so that we can check this concern on your Site and give you a possible solution.

    Best Regards,

    #663037

    kontakt-9949
    Participant

    Hello Aizaz,

    I have provided login info in the private content tab. Thank you so much for your help. Looking forward to a solution on this.

    #663038

    kontakt-9949
    Participant

    Hello Aizaz,

    I have provided login info in the private content tab. Thank you so much for your help. Looking forward to a solution on this. I have hidden the product content widget on mobile for these products now, as the bug still is there. For the “gassmaske” single product template.

    #663130

    Hello,

    Please check back your site, I have added the padding bottom in the video element and it is working fine. Check back your site and check the issue: https://ibb.co/TBHgYqZx

    Best Regards,

    #663333

    kontakt-9949
    Participant

    Hello Aitaz, unfortunately it is not working. As I told you, the space between the video widget and the element below changes by screen size, for every pixel. See my three attached screenshots for an explanation. Notice how I have three different screen sizes: 350px, 400px and 450px. The space between the video widget and the element below is very different for each size. What is the cause of this? There is a bug that creates this space. Please help me figure out what causes it. Looking forward to hearing from you.

    #663562

    Bogdan Donovan
    Keymaster

    Hi,

    Sorry for the misunderstanding. We have reviewed your issue and identified the cause. The problem lies in how the new Flexbox layout of the Elementor container element interacts with the aspect-ratio property, which is inherently used by the video element.

    Unfortunately, in this case, we can’t predict all possible combinations of nested Elementor elements to apply a universal fix in the theme, as it might negatively affect Elementor’s behavior elsewhere.

    To resolve your issue, please follow these steps:
    1. Remove the padding from the video element that was previously recommended.
    2. Open the single product layout “Gassmaske” used on the product page https://monosnap.com/file/NM2GoaCVIYC0gtdGa0F8m1ZmTDRDXI.
    3. In the editor, select the “Product content” element:
    https://monosnap.com/file/KXNkWZZYWQDwrFcuN2MM7OS0zSyv4n.
    4. Go to the Advanced tab and set the Width option to Full Width (100%), as shown in the screenshot:
    https://monosnap.com/file/iH17zsphEWUX9e6Sy6rXHXYkn0BqQI, then save the changes.

    If you make all these changes but the problem still persists, please let us know so we can investigate it further and provide you with a solution.

    Kind Regards

    #663616

    kontakt-9949
    Participant

    My friend, it worked. Thank you so much. This was a big issue for me, so I’m incredibly thankful for your help. Have a wonderful day!!!

    #663714

    Hello,

    You’re very welcome! If you need anything else, feel free to reach out!

    Thanks for contacting us.
    Have a great day.

    Topic Closed.
    Best Regards,

Viewing 11 posts - 1 through 11 (of 11 total)

The topic ‘Woodmart video widget overlaps with section below on mobile’ is closed to new replies.