How to left align home page title header on the casper theme?

Themes
1

Hello community,

I’ve just signed up for ghost and trying to give it a spin to replace my current wordpress site. I love the performance so far. However, I’ve encountered a basic but very nagging problem of not able to align the home page title header text to the left side on the default ‘Casper theme’.

I’ve tried various things like editing global.css files and screen.css files, nothing worked. Then I tried a couple of code injections with .site-header-content and .site-title and text-align:left – nothing worked here too. align-self: flex-start seemed to have done something but it aligned everything to the absolute left instead of the content margin (the blue line shown in the attached image below)

Attaching a screenshot below to visually explain the problem. All I am looking to do is left align the title header. I do not want the default center alignment. Please help!

header left align
header left align1920×1551 150 KB

2

Are you asking for something like this on the home page?

image
image1127×744 110 KB

If so, try this:

.site-header-content h1,
.site-header-content p {
  width: 100%;
  max-width: 1200px;
  text-align: left;
}
3

Yes! It worked like a charm. Thank you so much.

4

Hi - I’m trying to achieve the same result but in a Header on a page or post - any idea/help on how I might achieve that? And what file would I have to change? Thanks

5

Can you please create a new topic? Ghost 5.0 has been released (with Casper 5.0) so it’s best to include the theme + version when posting :slight_smile: