-
Hi, I just migrated from Yoast SEO and am trying to recreate a numbered list with some custom styling to my how-to block (example of style here: https://ibb.co/jHdpYfL). I’ve been able to complete most of the customizations, but can’t seem to get the styled numbers to show up – am I anywhere close with the code below?
ul.rank-math-steps,ol.rank-math-steps {
list-style-type: none;
counter-reset: rowNumber;
margin-left: 0;
}
.rank-math-step {
position: relative;
padding-left: 48px;
&:not(:empty):before {
display: inline-block;
position: absolute;
width: 30px;
left: 0;
content: counter(rowNumber);
counter-increment: rowNumber;
font-size: 16px;
font-weight: bold;
color: #fff;
text-align: center;
line-height: 1;
padding: 8px;
background: #c7c2b5;
border-radius:100%
}
The ticket ‘Styling issues with How-To block’ is closed to new replies.