Problem with Ordered & Unordered Lists Customization

Tagged: ,

Author Posts

EduardoChaves

Hi,

I’m having difficulties to customize the Ordered & Unordered Lists. They are dark on my website theme and I want them to be as the text color is: Print-screeen1 & Print-screen2

So I found these selectors for them: Print-screen3

And some interesting thing was that when I passed the cursor on the both Ordered & Unordered List it just turned white as the text color: Print-screen4. But to make sure it was ok I changed the color to white anyway…

But… when I refresh the page to see if it was all ok, it keeps dark again.

So I want to know if you guys know how to fix this problem… 😕

Link to the Page: https://fotografandooficial.com.br/politicas-termos/

Kind Regards,
Eduardo Chaves


Sebastian

Hey Eduardo,

I think there may be a couple of things going on. I see you have Autoptimize and maybe another caching plugin active. It’s best to temporarily disable those while working with Microthemer. Or clear the cache after making changes in MT. Those plugin might explain why things reverted when you refreshed the page.

Secondly, looking at your terms page, I can see that your theme uses ::before pseudo elements to style the bullets/numbers in unordered and ordered lists (a slightly unconventional technique that allows for styling them differently from the main text). So to target those, you would use the following selector.

.entry-content li::before

You can paste that in MT, or visually select any list item and then enable ::before via the CSS modifier options. See screenshot below:

Enable ::before

And here is how I identified the use of ::before when inspecting the page with Chrome’s developer tools:

Identify use of ::before

I hope that helps!

Cheers,
Sebastian


EduardoChaves

Thanks!

It just worked fine. The problem wasn’t the cache plugins, but this .entry-content li::before was the right selector I couldn’t find.

Thanks,
Eduardo Chaves


Sebastian

Awesome!

You must login or register to reply to this topic.