JSFiddle - React, Tailwind, and code Playground

by Kocsten

HTML

<div class="rasenlim_guvermis">
<ol>
<li><a href="#">Скрипты и шаблоны для сайта zornet.ru</a></li>
<li><a href="#">Скрипты и шаблоны для сайта zornet.ru</a></li>
<li><a href="#">Скрипты и шаблоны для сайта zornet.ru</a></li>
</ol>
</div>

CSS

.rasenlim_guvermis{
width:410px;
margin:0 auto;
}

.rasenlim_guvermis ol{
counter-reset: li;
list-style: none;
*list-style: decimal;
font-size: 15px;
font-family: 'Raleway', sans-serif;
padding: 0;
margin-bottom: 4em;
}
.rasenlim_guvermis a {
    position: relative;
    display: block;
    padding: .4em .4em .4em 2em;
    margin: .5em 0;
    background: #4156a5;
    color: white;
    text-decoration: none;
    box-shadow: inset 0.5em 0 #211f1f;
    -webkit-transition: box-shadow 1s;
    transition: box-shadow 1s;
}

.rasenlim_guvermis a:hover{
box-shadow:inset 2em 0 black;
}