Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • May 15, 2017 at 11:31 pm #793603
    Justin

    Hey guys,
    If you look at the in-progress link below you’ll see it renders the way I would like it too on a desktop.
    My primary concern is mobile. With the background set to no-repeat an fixed it, renders great on the desktop.
    When I review it on an ipad or iPhone, it doesn’t work for me. You will see just blank colored blocks rendering on each mobile device.

    Any suggestions on how best to proceed with this? I am thinking just removing the image elements (divs) altogether for mobile.

    Thanks!

    May 16, 2017 at 4:57 am #793691
    Nikko

    Hey Justin,

    Try adding this css code in Quick CSS (located in Enfold > General Styling):

    @media only screen and (max-width:767px) {
  #top .textCtr {
    min-height: 300px;
  }
}

    if that doesn’t help, you can remove those images by adding this css code:

    @media only screen and (max-width:767px) {
  #top .textCtr {
    display: none;
    padding: 0 !important;
  }
}

    Hope this helps :)

    Best regards,
    Nikko

    May 16, 2017 at 6:55 pm #794284
    Justin

    Thanks Nikko, how can I get my Ipad to render images correctly both on the portrait and landscape view when setting image backgrounds to cells?

    May 17, 2017 at 4:55 am #794597
    Nikko

    Hi Justin,

    It won’t really show whole part of the image on ipad since it will try to fit the background image to the size of the container, but I think this should help make it look better atleast:

    @media only screen and (max-width:1024px) and (min-width:768px) {
  #top .textCtr {
    background-size: contain;
  }
}

    Hope this helps :)

    Best regards,
    Nikko

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