[Resolved] Center Justify section images

[Joe]

Hey All,

Just wondering if anyone has figured this out. I’m using sections with background images on the front page of my site. However I’m finding on iPhone6 size screens they are not centre justified, meaning it shows an odd bit of the image.

I’d be interested to know if anyone has figured this out or knows of the controls for this in the CSS?

Website (Temp URL) is team5hack.uk for reference.

[Tom]

Hmm, give this CSS a try:

.generate-sections-container {
    background-position: center center;
}

However, all of your image won’t show on mobile – that’s just the way CSS backgrounds work with aspect ratios I’m afraid.

[Joe]

Thanks Tom! I understand it needs to scale the image, but when you are using a photo normally the middle has the main subject so this works much better I only (well for my current use case!)

[Tom]

No problem! Glad it’s working 🙂

[Neil]

Hi Tom,

It would be nice if this functionality was on the GUI for the section background and we could set it on a per image basis. Not all of the images I’m using have the main point of focus in the centre.

For now though, this CSS is great, thanks.

Neil.

[Tom]

I agree – it’s on the road map 🙂

[Author]

Posts