Hi! I'm using a masonry grid on a few different pages on my desktop site but I want it to display in one column for only one page on mobile. I've figured this out with CSS from another post (how to make the masonry grid one column only on mobile), but I can't figure out how to apply it to only one page. I want to keep it 2 columns on all other mobile pages.
The code that works to make it one column on all pages below:
@media screen and (max-width:640px) {
figure.gallery-masonry-item {
width: 100% !important;
float: left !important;
transform: unset !important;
position: initial !important;
display: block!important;
padding: 0px!important;
box-sizing: border-box;
}
figure.gallery-masonry-item img {
width: 100% !important;
}
.gallery-masonry-item-wrapper {
height: auto !important;
}
}