I need my website's title to align to the left.
-
I need my website title (Amelia’s Amazing Space Adventures) to align to the left. I also need the last two words to go beneath the first few words ( essentially to become a second line). This is to stop the text running through the illustration at the top of the website. I have tried several times to change it, including playing around with the Customizer, but to no avail. Can anyone help me?
The blog I need help with is: (visible only to logged in users)
-
Hi there,
I can offer some tips to get you started with these changes using Custom CSS. The first step to making a change like this is to figure out what CSS is controlling that part of your theme’s design.
I use the method from our guide to How to Find Your Theme’s CSS to figure that out. Looking there, I found that your site’s title is control by this CSS selector:
.site-header .home-linkYour theme’s default CSS adds a margin to your site’s title (which is what shifts the whole title to the right) and defines how wide the title can be. By adjusting those rules, you can change how the title appears.
Here’s an example of CSS you could use to do that:
.site-header .home-link { margin-left: 80px; max-width: 530px; }The first rule there defines the left margin as 80 pixels, and the second rules sets the maximum width at 530 pixels. However, I’d recommend playing around with that CSS a bit — you may need to make some adjustments, especially if you’d like to change how the title appears at different screen sizes. (Because of how the header area changes at different screen sizes, one change may not work for all screen sizes.)
We have additional tips for working with CSS in our CSS Basics guide. If you’d like more help adjusting that CSS for your site, we also have quite a few expert volunteers who can help with CSS in the CSS Customization forum. :)
- The topic ‘I need my website's title to align to the left.’ is closed to new replies.