Custom Ordered List

[manavecplan]

hey,

I'm using ordered lists in my posts that I'm trying to style in a particular listicle fashion i.e. I'd like the numbers in the ordered list to be styled the same way as the items themselves. I'd also like the list items to be H2 headers since they're pretty large sections in themselves.

My post HTML is as under:

<ol class="listicled">
<li><h2>Meh 1</h2></li>
<li><h2>Meh 2</h2></li>
</ol>

The CSS I'm using to try to style is below based on(SP Forum Link):

/*--- Post Ordered List Styling ---*/
.listicled ol li {
	font-family: 'clarendon-urw';
	font-size: 36px;
	font-weight: 600;
}

.listicled h2 {
	font-family: 'clarendon-urw';
	font-size: 36px;
	font-weight: 600;
}

However, the H2 tags are picking up the generic .entry-content styling for an H2 and the numbers aren't picking up any styling at all.
Screenshot of current post

What am I doing wrong here?

[Victor Font]

We need to see your source code in our browser. We can't tell you want's wrong from a screen shot. Please post a link to an example page.

---

Regards,

Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?

[manavecplan]

Hey Victor,

Fair point...

Rolled up a dummy post below which has the same styling.

Test

[Victor Font]

All you need in your css is the listicled class.

.listicled {
	font-family: 'clarendon-urw';
	font-size: 36px;
	font-weight: 600;
}

If that doesn't work, use .entry-content .listicled

---

Regards,

Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?

[manavecplan]

Hey Victor,

Tried both options but neither have worked out...

Nothing seems to be hitting the numbers in the ordered list at all...

[Victor Font]

You may have to hold the shift key down when you refresh your page to force the style sheet to reload. I tested this in my browser inspection tool and the what I gave you works. Also, clear any caches you may have activated.

---

Regards,

Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?

[manavecplan]

Hey Victor,

Got around to testing it today...

The styling worked just fine with the .entry-content .listicled selector.

Thanks much for helping out! 🙂

[Author]

Posts