Streaming live at 10am (PST)

How to break long string of text inside a grid?

We have a few long strings of text that we want to break as screen size gets smaller.

We included the following in the site’s head section (under project settings page):

.circular-display-example, .circular-headings-example {overflow-wrap: break-word; word-wrap: break-word; -ms-hyphens: auto; -moz-hyphens: auto; -webkit-hyphens: auto; hyphens: auto;}

This was based on the solution from this thread: Break/wrap link in mobile view

But the strings of text didn’t break, and we want them to break responsively as the width of grid 5 changes.

Can anyone help please?


Our read-only link is here