The Grid - Filters and Responsive

Hello,

I have a couple of questions using The Grid on this page: www.policromia.es/projectes

Responsive Text
Is it possible to set the text that appears on each element on the grid (the title) to a size according to the size of the squares (the items)?. I like quite a big font on the big screen, but when the screen gets smaller, I would like to set a smaller size. Is that possible?

Margins
I am setting a quite wide margin on desktop as I like the minimal and “breathe” look that it has.
But that margin applies also on a mobile device, where it doesn’t make sense and concentrates the post on a thin space on the middle of the screen, leaving the same margin than in the desktop. Is there any way that I could reduce de margin on the portable devices? Thank you :slight_smile:

Thank you so much for your help in advance.
Please, let me know if you need any more details.

All the best,

Hello There,

Thanks for writing in!

1.) You ill need to edit your skin and change the font size from px to em. Em is much more responsive than ps because PX is a fixed size.

And if it isn’t enough, you can apply this custom css:

@media(max-width: 979px){
    .tg-policromia .tg-element-1 {
        font-size: 1.5em !important;
    }
}

2.) Could you please provide us a screenshot of which margin would you want to adjust? If it is the left and right margin of the grid, please edit your page back in Cornerstone and insert the following custom css in the settings tab, Settings > Custom CSS

@media(max-width: 979px){
    .tg-policromia .tg-element-1 {
        font-size: 1.5em !important;
    }

    #grid-238 {
        margin-left: 20px !important;
        margin-right: 20px !important;
    }
}

I added the code in #1 to avoid clutter.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.