Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • September 18, 2014 at 10:55 pm #321545
    gb

    Hi,

    I noticed that my blog that uses the masonry grid only shows part of the date and image outline but no actual images when viewed on a mobile phone.

    Ideas?

    THANKS,

    GB

    September 19, 2014 at 9:43 am #321762
    Ismael

    Hey gb!

    Thank you for using Enfold.

    Please post the link of the actual page here. We would like to check it.

    Best regards,
    Ismael

    September 19, 2014 at 4:44 pm #321975
    gb

    Oops, sorry to forget that, here you go:

    http://www.gregorybeylerian.com

    September 20, 2014 at 9:47 am #322261
    Ismael

    Hey!

    Thank you for the link.

    Looks like you changed the width of the masonry entries. They are set to 100% when viewing on mobile device by default but it’s showing only 20% of the actual image size. Please add this at the very bottom of Quick CSS or custom.css:

    @media only screen and (max-width: 480px) {
.responsive #top .av-masonry-entry {
width: 100%;
}
}

    You can also adjust the width to 50% if you want 2 columns.

    Regards,
    Ismael

    September 20, 2014 at 5:00 pm #322420
    gb

    Hi Ismael,

    Thanks for getting back to me.

    Yigit gave me the following code,

    So my masonry grid could be viewed with 5 posts across:

    Please add following code to Quick CSS in Enfold theme options under General Styling tab
    #top .container .av-masonry-entry {
    width: 20%;
    }

    Is there a way to view my masonry grid the same way on a mobile device?

    Also, is there a way to view my whole site on mobile the way it is viewed on a desktop?

    Is the solution turning off mobile responsiveness?, Possible?

    Thoughts?

    THANKS!!

    GB

    September 21, 2014 at 8:29 pm #322685
    gb

    BTW , when I added the code that creates one row or two rows if using 50% – the title that activates with mouse over is activated automatically on iPhones and iPads. This creates a problem because the text blocks the image.

    View on mobile phone to see what I mean:

    http://www.gregorybeylerian.com

    Since there is not a mouse over on these touch devices, is there a way to keep it turned off on just these devices or is there an other solution?

    THANKS,

    GB

    September 22, 2014 at 8:07 am #322835
    Ismael

    Hi!

    You can hide the masonry content on iPad view. The solution is on the other thread: https://kriesi.at/support/topic/what-code-can-resolve-this-masonry-issue-on-mobiles/

    Regards,
    Ismael

  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)
  • The topic ‘Images not showing up with masonry grid on iPhone 5S?’ is closed to new replies.