Skip to content

Instantly share code, notes, and snippets.

@wpgaurav

wpgaurav/list-style.css

Last active Nov 28, 2020
Embed
What would you like to do?
List Style for Bablu Yadav
article ol li {
list-style:none;
padding:10px 20px;
border-bottom:1px solid #ddd
}
article ol {
counter-reset:rowNumber;
padding:0!important;
background: white;
border: 1px solid #ddd;
padding: 1em;
margin-left: auto;
margin-right: auto;
box-shadow: 0 5px 25px rgba(0, 0, 0, 0.2)
}
article ol li:before {
display: inline-block;
width: 20px!important;
height:20px!important;
left: -20px;
margin-right:20px;
content: counter(rowNumber);
counter-increment: rowNumber;
font-size: 0.9rem;
font-weight:600;
color: #fff;
text-align: center;
line-height: 1.3;
padding: 8px;
background: #fc742f;
border-radius: 100%;
font-weight:700;
font-family:system-ui,sans-serif;
}
article ol li:nth-child(even){
background:#eee;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment