Headline Text Not Responsive in Global Block!

[core365]

Hi, I’ve created a few global blocks and I’m struggling with how to make the headlines responsive as the option for it isn’t appearing in the Page Settings. What might complicate it a bit more is that I’m then using the global blocks in the side bars down the right hand side of the pages!

Here’s an example of it - the text ‘Guarantee’ goes outside the box and I want it to be within it:

I’ll put the URL in a secure note as it’s being built on a temp link.

Thanks!

[friech]

Hi @core365,

Thank you for writing in, unfortunately, you can not set up a Responsive Text Settings on the Global Block, so you need to set up the Responsive Text Settings page per page.

There is another way though, please add this to your Headline’s Element CSS area.

@media (min-width: 980px) and (max-width: 1400px) {
	$el.x-text.x-text-headline .x-text-content-text-primary {
		font-size: 2.5vw;
	}
}

You can find the proper CSS code selector using the Chrome browser Developer Toolbar
For the CSS code itself, I suggest that you get started with this tutorial

Hope it helps,
Cheers!

[core365]

That’s great, thank you!

Cheers!

[thai]

Glad we were able to help