text content to be have fixed width after a certain size

[panteley]

Hi,

Was wondering, is there any way to make this text in the first section, not to adapt to grid 'so to say' after a certain width.

What I mean, is the text box above not to extend more than how it looks in the image.

For reference, see this text box here:

It responds when the browser is decrasing, but this form/view won't be deformed doesn't matter how big the screen is,

🤔

[panteley]

@arminunruh

I think I did it through some CSS,

.main-text-cover {
	width: 70%!important;
  align-items: center!important;
  justify-content: center!important;
}

Just now I have to find how to center it, :D

[arminunruh]

can you right click the text, and then click:

here you have settings for this i think this fixes it
pls remove or comment out your css before using this

[panteley]

Tried it before I went for the costum CSS, and while it was changing in the Gridder, it wasn't affecting at all the element in the website preview.

Maybe isn't 100% precise, but the costum CSS is working fine for now.

Thank you again, :)

[arminunruh]

you could also think about using a textformat with fontsize in %. this way the text scales

[panteley]

@arminunruh Is there any way I can center the text block? 🤔 It's all I need now

[felix_rabe]

@panteley

Add this to your main-text-cover css:

left: 50%!important;
transform: translateX(-50%);

[panteley]

@felix_rabe

Thank you man, it works almost perfectly. If I can only get rid of that fraction of a second when you load the page and the text box moves from right to center.

[felix_rabe]

@panteley try this:
transform: translateX(-50%)!important;

maybe this forces your style to be applied at page load.

[panteley]

@felix_rabe

and it worked! 🎉

Appreciate your help a lot! 🙏