Red Number List
A styled OL with brand colored red numbers
Rendered Component
- one item
- cat item
- garden item
Markup
HTML
<ol class="red_number_list">
<li class="red_number_list_item">one item</li>
<li class="red_number_list_item">cat item</li>
<li class="red_number_list_item">garden item</li>
</ol>
Styling
CSS
.red_number_list {
list-style: none;
counter-reset: list;
}
.red_number_list_item {
counter-increment: list;
}
.red_number_list_item:before {
font-weight: 700;
color: #c00404;
content: counter(list) ". ";
float: left;
margin: 0 0 0 -20px;
}