I figured out how to do this by adding custom HTML to the Homepage template. 🙂
I ended up using
background-position: top center !important;
and it looks great.
That helped a ton on my home page hero. Now I just need to figure out what is so different about the other pages. Off to a great start, though. 🙂
I’m referring to the hero BG image and the ‘cover’ CSS associated with it.
It’s unpredictable where it will crop on different screen sizes.
Check out greenless.com and look at the hero on the homepage. Adjust the screen size in your browser and scale it in to phone size and you’ll see what I mean.
I just want a way to tell it to align to the vertical & horizontal center.