charliehanger

Yes! That works! Thanks so much.

I’ve tried a bunch of css combinations of text-align: center. The code below is in place now. It seems to do something, in that the little pencil-edit icon shifts and I can see the code when I inspect the page, but it’s not visibly centered.

.footer-widgets.column-one.grid-item .widget {
	text-align: center;
}

.footer-widgets.column-two.grid-item .widget {
	text-align: center;
}

I was having an issue with this as well. I had a background image set to “Fill Screen,” and I clicked the center dot for “Image Position.” It looked great when I previewed desktop/tablet/phone on the WP customizer.

But when I looked at it on my actual phone (iPhone X / Chrome), the background image was zoomed in much closer, so that instead of the entire image, I could only see a tiny portion of the top of the image.

To fix it, I created a new crop of my background image that was tall and skinny (phone-shaped) and then edited the CSS to call that image for mobile. I also changed the background-size to “contain” in the CSS.

Here’s the dev site and CSS:

https://yzb.e62.myftpupload.com/

@media only screen and (max-width: 481px) {
body.custom-background {
background-image: url(/NEW IMAGE URL HERE);
background-size: contain;
}
}

Thanks @etienne-r-2 and @domainsupport. I figured out my issue. I had just dropped a } in the code above, so WP wasn’t reading my changes. Sorry for the runaround!

Thanks @etienne-r-2! I was copying and pasting the from the style.css file, so I’m pretty sure I have the dashes correct. Here’s what I have again:

:root {
	--primary-nav--font-size: var(--global--font-size-xs);
	}

Strangely, the 30px option didn’t work for me either, but I’m hoping to stick with the CSS variables anyway.