Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #1012808

    Hi Enfold Team

    I want to use a few iframes on a new client website. Works ok on pc etc but on mobile the iframe is way to small – should be at least 2x height of what it is. Please ref. to screenimg. in private content.

    I hope you can supply me with at little css to adjust the size of the iframe.

    Thanks in advance

    #1013476

    Hey Carsten,

    Thank you for using Enfold.

    What is the url of the site? I tried the link from the screenshot but that site doesn’t exist.

    Best regards,
    Ismael

    #1013523

    Hey Ismael

    Thanks for getting back to me.

    Please find login data etc in private content…

    – however, the issue described is not specific for this webpage, it is a general issue for all the sites, I have build with Enfold, so I figured there would be a css code to adjust the size of iframes.

    Thanks for looking into it :-)
    Best regards

    #1013764

    Hi nonne,

    Here is the code you can put in Enfold > General Styling > Quick Css,  if it does not work, put into themes/enfold/css/custom.css

    
    @media only screen and (max-width:479px){
        .mfp-iframe-scaler {
            height: 70vh;
        }
    }
    

    If you need further assistance please let us know.

    Best regards,
    Victoria

    #1013840

    Hi Victoria

    Thanks, that works :-)

    One more thing: How do i remove the previous / next arrows that shows up with the iFrames?

    Thanks in advance

    #1013892

    Hi,

    The test page password above is not working for me.

    Best regards,
    Jordan Shannon

    #1013989

    Hi Jordan
    I think you might have mixed info about wp-login with password for the actual page (password protected) in private content.earlier provided.

    What I am looking for is a css to hide the arrows “next” and “previous”

    Thanks

    • This reply was modified 6 years, 1 month ago by nonne.
    #1014036

    Hi,

    Thanks for the clarification. Please try the following in Quick CSS under Enfold->General Styling:

    .mfp-arrow {
     display:none;
    }

    Best regards,
    Rikard

    #1014070

    Hi Rikard
    Thanks for getting back to me – however this css does not seem to have any effect. I did clear cache etc… Any other suggestions?
    Best regards

    #1014110

    Hi,

    Please try this instead:

    .mfp-arrow {
      display:none !important;
    }

    Best regards,
    Rikard

    #1014120

    Thanks Rikard – that did the job :-)

    Best regards

    #1014257

    Hi nonne,

    Glad we could help :)

    If you need further assistance please let us know.
    Best regards,
    Victoria

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