Heading Text Issue

[maximearmstrong]

Hello,

I have an issue regarding my heading title. They just go off the page if they are too long.

Also, i set my website width to 940, and i feel like my others heading title, which are shorter, are not really centered even if i entered the right css for it (a little bit at the right of the screen)

My Url is http://www.pluriels.ca

[Kyle – SUPPORT]

Hi

Try adding this custom css:

.page-heading .heading-text h1 {
  text-align: center !important;
  white-space: pre-wrap;
}

– Kyle

[maximearmstrong]

Hey Kyle!

Thanks for this! It worked!

However, the text is still more at the right of the page, and not align with the logo. Do you have any idea regarding this?

I have also these lines in my css

 .page-heading .heading-text {
width:100%;
}

[Rui Guerreiro – SUPPORT]

Hi,

Just remove this following line from the css above.

text-align: center !important;

It will align by default to the left, and it will stay aligned with the logo.

Best Regards,
Rui

[maximearmstrong]

Hi Rui,

Thanks for your answer, though this isn’t my concern. I want my text to be center aligned, but it goes off the page’s margins. I did red marks on the picture so you can figure out what i mean.

[Rui Guerreiro – SUPPORT]

Hi,

That is because of the size of the text Header width. I made an experiment and if we reduce the size to fit those lines you draw in the image the text don’t have enough space and it will create a 3rd line.

But this always depend of the title amount of characters. My suggestion is that we reduce the width of the title to fit the limits you draw but we also have to decrease a few pixels in the font size(currently is 42px) so that the title stay in 2 lines and inside the margins you defined.

Let me know what do you think.

Best Regards,
Rui

[maximearmstrong]

Hello Rui,

Thank you for your answer! I have no problem to get a 3 lines title, so I would prefer to keep my 42px for the font height and change only the margins!

Regards,
Maxime

[Kyle – SUPPORT]

Thanks Rui

[Rui Guerreiro – SUPPORT]

Hi,

Adding another line to the custom css that Kyle provided earlier on this topic will look like this.

.page-heading .heading-text h1 {
text-align: center!important;
white-space: pre-wrap;
width: 940px;
}

Best Regards,
Rui