display 2 blog tiles instead of 3 on tablet

This topic has 6 replies, 2 voices, and was last updated 2 years, 7 months ago by elvin.

Viewing 7 posts - 1 through 7 (of 7 total)

Author

Posts
January 28, 2021 at 2:41 am #26027

Ben
Participant

Hey guys,

I’ve got WP Show Posts set to 3 columns which look perfect of desktop and mobile.

But displaying 3 columns on a tablet looks squashed and pretty rubbish.

Is there any way I can show 2 columns on a tablet instead of 3?

Thanks

Ben

January 28, 2021 at 11:54 pm #26077
elvin
Moderator
Hi there,

You can try adding this CSS:
```
@media (max-width: 1024px) {
    .wp-show-posts-columns, .wp-show-posts-inner {
        margin-left: 0 !important;
        margin-right:0 !important
    }

    .wp-show-posts-columns .wp-show-posts-single {
        display: block;
        width:50%
    }

    .wp-show-posts-image.wpsp-image-left, .wp-show-posts-image.wpsp-image-right {
        float: none;
        margin-right: 0;
        margin-left:0;
    }
    .wp-show-posts-image img,
    .wp-show-posts-columns .wp-show-posts-single:not(.wp-show-posts-masonry-block) .wp-show-posts-image img{
        width: 50%;
        max-width: unset;
        object-fit: unset;
    }
}
```
January 29, 2021 at 2:34 am #26078

Ben
Participant

OK thanks,

I’ve added that code.

However, there’s no gutter between the tiles and the images haven’t expanded with the tile itself.

How would I fix this?

Thanks

January 29, 2021 at 4:10 am #26082
elvin
Moderator
You can remove this line within the provided CSS to keep the default gap.
```
.wp-show-posts-columns, .wp-show-posts-inner {
        margin-left: 0 !important;
        margin-right:0 !important
}
```
January 29, 2021 at 8:19 am #26093

Ben
Participant

OK that works.

But what about the images as they’re too small?

Thanks

January 30, 2021 at 1:18 am #26119

Ben
Participant

Doesn’t matter, I’ve fixed it.

Thanks

January 31, 2021 at 8:46 pm #26192

elvin
Moderator

Nice one. Glad you got it sorted. 🙂
Author

Posts

Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.

[Resolved] display 2 blog tiles instead of 3 on tablet