The Grid responsive text

Support
#1

Gah! I have tried to figure this out on my own but I cannot. The text on the skin of this Grid is not responsive on smaller sizes. You can see it here:

http://3ed.1cd.myftpupload.com/education/

On the smaller sizes the grid items get smaller but the text does not - it just overflows the grid items.

I’d also like it to quit hyphenating the titles. For instance, Centenary Haynes Fit-ness Center. I’d like the line to break after Haynes and before Fitness instead of hyphenating Fitness. white-space: nowrap; takes out the hyphen, but then the word just overflows the grid item. " (

Help! And thank you!

#2

Hi,

To fix it, you can adjust the font size on smaller screen size using media queries.

@media(max-width:979px) {
.tg-brasilia-custom-2 .tg-element-2 {   
    font-size: 15px !important;
}
}

@media(max-width:767px) {
.tg-brasilia-custom-2 .tg-element-2 {   
    font-size: 12px !important;
}
}

For more information regarding media queries kindy refer to the link below

Hope that helps.

#3

Thanks, that worked pretty well.

#4

Glad it worked.

Cheers!