Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search

Mobile image layout to single


Recommended Posts

Site URL: https://www.nickbarr.co

Hey all,

 

How do I get single image layout on mobile? I have it set to Masonry Grid with 3 columns in square space, I like the look of desktop view, but not on mobile.

 

It used to be single grid on mobile but recently it change through square space. Any fixes that will help me with mobile layout only?

 

Many thanks!

Screen Shot 2020-08-17 at 12.01.37 PM.png

Screen Shot 2020-08-17 at 12.01.30 PM.png

Link to post
  • Replies 6
  • Created
  • Last Reply

Top Posters In This Topic

Add to Home > Design > Custom CSS

@media screen and (max-width:767px) {
.homepage {
.gallery-masonry-wrapper {
    height: auto !important;
}
figure.gallery-masonry-item {
    position: static !important;
    width: 100% !important;
    transform: unset !important;
    margin-bottom: 20px;
}
.gallery-masonry-item-wrapper {
    height: auto !important;
}
.gallery-masonry-item img {
    width: 100% !important;
}
}
}

 

You can send your question to my email to get faster answer. / How to Setup Password & Share URL 

-- I'm Tuan, work for a non-profit project (build free libraries). I check the forum once or twice a day to help out the community. If you don't see me answering your question, you can send it to the email above. 

Link to post

Genius, thank you so much, looks perfect now! screen shot below.

I thought it would fix the gallery link to the image but that still shows up as 2 grid. Anyway to also have that as a single row in mobile view? See the attached image.

Screen Shot 2020-08-18 at 4.55.28 PM.png

Screen Shot 2020-08-18 at 4.55.20 PM.png

Link to post
  • 1 month later...

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...