Amanda Gonzalez

On 2/8/2023 at 8:17 PM, tuanphan said:

Because you are using Masonry Layout. Add this to Design > Custom CSS. Change 70px to adjust spacing

/* Blog Masonry to grid mobile */
@media screen and (max-width:767px) {
div#BlogMasonryContainer {
    height: auto !important;
    display: grid;
    grid-template-columns: repeat(1,1fr);
    grid-gap: 70px;
}
div#BlogMasonryContainer>article {
    transform: unset !important;
    width: 100% !important;
    position: relative !important;
}
div#BlogMasonryContainer img {
    height: auto !important;
}
.blog-masonry .image-wrapper {
    height: auto !important;
}}

 

PERFECT. Thanks so much, tuanphan. It worked a treat!

Thanks for responding, tuanphan!

The problem is on the landing page using mobile, so using a mobile browser/viewer, go to https://studiojournal.co, and you'll see my spacing issue there.

I hope this helps!

Thanks again.

Amanda

Hi there!

I'd like to make the same changes as Georgiaperson: add more space underneath the Read Me on mobile view only, but I've not been able to make it work using the answers above.

My site is studiojournal.co

FYI: I'm using Masonry and Fluid Engine. 

If anyone could lend a hand, it would be much appreciated!

Amanda