[Resolved] embedding responsive iframe, extra space

Home Forums Support [Resolved] embedding responsive iframe, extra space

Home Forums Support embedding responsive iframe, extra space

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #625497
    Eva

    Hi!
    I have embedded a responsive iframe with a catalog. No I would like to add some extra space to the top and the bottom. Would that be possible? Can be seen here: https://www.mariandriessen.nl/oeuvrecatalogus/
    Another problem is that the producer of the content in the iframe says it’s difficult/impossible to make magnifying the images work in an embedded environment. You have to click on an item in the iframe to see this possibility. I hope I have explained this properly… ๐Ÿ™‚
    Thanks for helping out!
    Eva

    GeneratePress 2.1.3
    GP Premium 1.6.2
    #625527
    David
    Staff
    Customer Support

    Hi there,

    there is very little control over the styling of the iframe contents.
    You can make the iframe container larger by adjusting this CSS and increasing the padding or by setting a minimum height:

    .iframe {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 25px;
    height: 0;
    }

    To make a lightbox break out of the iframe would require some custom coding on both the content providers site and your site.

    This question came up on StackOverflow:

    http://stackoverflow.com/a/8855410/1055987

    #625559
    Eva

    Thank you for your fast reply, David!

    I have changed the padding-bottom to 60% and it looks better now, at least on a desktop. I noticed changing the padding-top doesn’t make any difference, but it’s quite ok now. I have used this CSS now:
    .iframe {
    position: relative;
    padding-bottom: 60%;
    padding-top: 25px;
    height: 0;
    }
    .iframe iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    }

    Is that correct or should I leave the second part out?

    I will pass the StackOverflow link on to the producer of the content, although I think we can now live with the fact that the images can’t be enlarged ๐Ÿ™‚

    Thaks again for the great support!

    #625580
    David
    Staff
    Customer Support

    Hi Eva,

    that looks correct, i would leave it as is.
    Yes it will require the content producers effort to make it work.

    Glad i could be of help

    #625587
    Eva

    Thank you!!

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