Responsive text in essential grid?

Support
#1

Hello,
I’m using Essential Grid a lot in my site; the problem I have is that i’m designing my Essential Grid Skins for a computer browser and it looks fine there; but when I visit the site on mobile, the text is way too big:

https://irl.studio/

I found this thread:

I tried adding that CSS to my Customizer, for the front page (the link above), but I don’t see any difference.

How can I fix this?

-ali

#2

Hello There,

Thanks for writing in! I have checked your site and I can see that the code is perfect working. Please keep in mind that the code will only work when the screen size is less than 798 pixels. To make sure that it is taking effect, you can add a color so that you will know that the code is working or not. For example:

@media (max-width: 797px) {
    .esg-grid * {
        color: red !important;
        font-size: 28px !important;
        padding-left: 0 !important;
        line-height: 28px !important;
    }
}

You can remove the red color later on.