I've noticed when viewing the Mobile version of my website that the heading for it is off-center and is hugging the right side of the webpage, I've tried adjusting the size of the text as well as adjusting the size of the block. I've had some results where the text has gone from this(See Ex. 1) to somewhat of a correct format(See Ex. 2). However once it had the 'correct' format, it was still hugging the right side of the page and at this point reached a size small enough if ruined the look all together. How can I go about fixing this issue with the heading? It's almost as if it doesn't allow me to utilize the space I have set for my block, no matter what I do I can't get the text to leave the right side of the page. Adjusting the alignment did no good either, it adjusted the text to align on the left while still hugging the right side of the page, this was the same for all alignment changes. I've also noticed that while making these changes it also changed the way my Desktop website appeared. How could I go about making this change specifically for the mobile version of my webpage?
IMAGES FOR EXAMPLES ARE PROVIDED AT THE BOTTOM!
Ex. 1 (How mobile looked, hugs right side of page):
"H
E
L
L
O"
Ex. 2(Somewhat of a correct format, while being too small + hugging right side of page)
"hello, we-
lcome to
the web-
site"
The goal is for my mobile website to display the header in the center of the page, just as it does on the Desktop version of my website. I know some adjustments will need to be made in regards to text size and such which I'm fine with, I'm just genuinely looking for a way to properly have this scaled, positioned, and only affect the Mobile version of the site. Any information would be a massive help, thank you in advance!
