Section hero alignment with header

hello, please your help.
How can I make the text of my hero section always aligned to the width of the header and the rest of the website?

Thank you

This question is a bit vague. Perhaps you can provide an example on a website so we can see exactly what you mean.

Text alignment is accomplished through the Options panel > Text Options > Alignment


In Bootstrap 5, text can either be aligned to start, end or center.


If you’re talking about justified text, the Bootstrap developers felt it should be removed from Version 5 of Bootstrap for aesthetic reasons (which makes no sense to me since pretty much all browsers support text hyphenation now) but since it’s been removed from Bootstrap, you will no longer see the option for Justified text in Bootstrap Studio unless you build your website in Bootstrap 4. You can easily create your own class and manually justify text by adding the following code to your custom CSS stylesheet…

.text-justify {
text-align: justify

Then just add the justify-text class to your components via the Attributes panel > Class Names field.

Your Header probably has a ‘container’ that is set to Fluid, while the container with your text does not have the Fluid set. To check, select the container in the Header, then select the ‘Options’ tab on the right of the UI, then check if the ‘Fluid’ setting is on or off. Now select the container that holds your text and make sure it has the same Fluid setting as the Header does.

1 Like

Hello… awesome! that was the issue… thank you!