Archived topic
Styling password protection screen
9 replies · Started by Crystal on January 3, 2019
I need to know how to style the password protection screen. I found some CSS that helped me center the actual box, but the text is still to the left, and I'm not sure how to fix that. I'd also like to add some padding to the top.
Hi there,
Have you tried setting the page builder container of that page to default instead of full width?
https://docs.generatepress.com/article/page-builder-container/
I went to that option in Customization, and that's not what my menu looks like. The only dropdown says Content Layout, and it lets me pick between One Container and Separate.
It's a metabox so it will be on the Edit Page screen.
I'm really confused. I don't have a page set up for the base password protection screen, and my searching online didn't have really clear answers about whether that was even possible. I don't want to edit this specific page. I want to edit the styling on the general Wordpress password protection.
Hmm something is setting it to full width.
Are you using the Layout Element?
https://docs.generatepress.com/article/layout-element-overview/#container
Just to be clear, I believe it's a generic Wordpress "page" but not an actual page I created. It's the screen people get when I password protect something.
And I don't know why, but now the text is centered, but I have a new issue.
I had to change the text color back to a dark color because changing it to white so it was visible on this page made some text elsewhere on a white background "invisible," so I need to figure out how to make the text on just this page white.
I have this put in for centering (I think), but I don't know how to change the color of the text that comes before it, along with "Password" next to the box. You can see it by highlighting here: https://www.pikkoshouse.com/box/january-2019/
This CSS should do:
.post-password-form {
color: #fff;
}
Thank you!!
No problem :)