• This topic contains 9 replies, has 2 voices, and was last updated by  Bartosz 1 year ago.
Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #24410

    mattock
    Participant

    Hi, I just purchased fancybox Pro to use in responsive lightbox and my Vimeo embedded videos are not filling the space. It has ugly white space top and bottom?

    Im using beaver builder and a normal button calling the video
    Do I need to add anything, like setting the dimensions etc, I thought it would just be responsive and always fill the lightbox space?

    See screenshot: fancybox-space

    #24439

    mattock
    Participant

    Hello, anyone?.. can you help with this please

    #24492

    Bartosz
    Keymaster

    Hi,
    Can we have a look at it at the live site?

    #24493

    mattock
    Participant

    http://fullrotation.com click the “play showreel” button

    Its using beaver theme and beaver builder and the button is a module
    I just added the vimeo link to the button

    Resize the window to see it, gaps appear right and bottom

    Thank you

    #24495

    Bartosz
    Keymaster

    Strange, we’re not sure where the issue comes from but it should be ok with the following CSS snippet added to your theme (or custom CSS in Customizer):

    iframe .fancybox-content {
    width: auto !important;
    }

    #24525

    mattock
    Participant

    Hi, thanks but that had no affect at all. So I did an inspect in chrome and this worked

    .fancybox-slide–iframe .fancybox-content{
    width: auto !important;
    }

    but it needs the height also to work correctly at first
    height: auto !important;

    But when the height is added its not correct on mobiles in portrait or tall screens as the video sinks to the bottom of the page… but without the height also I still get a white gap sometimes underneath

    thanks

    #24526

    Bartosz
    Keymaster

    Hi,
    Sorry, it look like it cut the class name:

    .fancybox-slide–iframe {
    width: auto !important;
    height: auto !important;
    }

    When used this it seems to look fine on all devices.

    #24542

    mattock
    Participant

    HI thanks but that new code unfortunately that looks the same as the original white gaps
    see screenshot
    see screenshot

    this code below is the only thing that helps, but adding height makes it perfect on desktops but sink to bottom on mobiles and tall screens

    .fancybox-slide–iframe .fancybox-content{
    width: auto !important;
    }

    … I just want an out of the box simple solution that keeps the video centred and responsive
    Thanks

    #24579

    mattock
    Participant

    Can I get a refund please? I think we get 14 days correct?
    Thanks

    #24591

    Bartosz
    Keymaster

    Sure, it’s not a problem.
    However the code above worked perfectly in our tests.

Viewing 10 posts - 1 through 10 (of 10 total)
  • You must be logged in to reply to this topic.