-
Posts
-
Hi,
I’m using the Masonry Gallery element on my homepage. I would like to have the Masonry element show up differently on mobile phones. As it is now it shows the Masonry photo’s screenwide all under each other. But because it’s a bit of a long scroll to get to other content this way I’m thinking this needs to change.
Best I would like smaller thumbnails of the masonry photo’s to show. So maybe there can be shown 2 of them side by side. And then also maximize the amount shown and put in scroll buttons to show the next batch? Is this possible? I just want this on mobile phones. Tablet view is fine like it is.
Regards,
Erik
Hey erikvermeulen!
Open up /enfold/css/shortcodes.css and around lines 2474 – 2508 you can see the code for changing their columns on smaller screens.
On line 2494 you can see where it gets set to 100% width on screens 480px wide or smaller.
@media only screen and (max-width: 480px){ .responsive #top .av-masonry-entry{width:100%;} }If you want to keep it at two columns then you could just delete that section so it stays on 50% width.
Best regards,
ElliottHi!
It this fixed? You can use the css code above to change the width of the masonry entry on mobile phone devices.
Best regards,
IsmaelHey!
Yes you can change it to 50% if you want two columns on screens smaller than 480px.
Regards,
Elliott
- The topic ‘Masonry Element on mobile devices’ is closed to new replies.