[Resolved] Styling the "page-numbers" class with the customizer.

[Ron]

Am I looking at it and simply not seeing it… or is there no way to customize the “page-numbers” class in the customizer?

Just wanted to check before I try to do it via the “Additional CSS” column within the customizer.

Thanks,
Ron

[Leo]

Hi there,

There isn’t a built-in option to style the page numbers.

Let me know if you need help with the CSS 🙂

[Ron]

Thanks Leo,
I’ve got it mostly worked out. As it is now, things look good enough not to obsess over the remaining 20%.

The two small things remaining (as shown on http://www.ronjones.io/page/2 at the bottom:

1. the instructions below give me the right look in Firefox. But the font color in Chrome is still the link color I specified in the configurator (it uses my palette, so it’s no big deal).

2. in both chrome & firefox, the background of the “current page” box still glows blue on hover. Even if I add .page-numbers.current:hover to the list below (I’ve added it in to the third set to show how I tried it).

.page-numbers {
color: #a1a1a1;
background-color: #efefef;
border: 1px solid #a1a1a1;
border-radius: 4px;
}
.page-numbers.current {
color: #ffffff;
background: #a1a1a1;
border: 1px solid #b11900;
}
.page-numbers.current:hover,
.page-numbers:hover {
color: #ffffff;
background-color: #a1a1a1;
border:1px solid #b11900;
}

[Leo]

I’m seeing this CSS that’s providing the blue background color:
https://www.screencast.com/t/GrMFGBtj3kR

[Ron]

Thanks Leo!
I’ll play with this some and see what I can do.
Ron

[Leo]

No problem 🙂

[Author]

Posts