JSFiddle - React, Tailwind, and code Playground

by Ashish Sharma

HTML

Hover that:<br>
<div id="menu">
<p id="menup"><a href="#" >Something</a></p>
<p><a href="#">Something Wled</a></p>
<p><a href="#">sdfsg sgsgse</a></p>
<p><a href="#">vedvse vvev</a></p>
<p><a href="#">sevsev svse</a></p>
</div>

<p><a href="#">vedvse vvev</a></p>
<p><a href="#">sevsev svse</a></p>

CSS

#menu p{
    margin: 0;
    display: inline-block;
    
}
#menu p a {
    display: block;
    border: solid 2px maroon;
    /* always: */
    padding: 2px 5px 2px 5px;
    height: 20px;
    background:rgb(200,200,200);
   -webkit-box-shadow: 0 5px 13px rgba(0, 0, 0, 0.15) inset;
-moz-box-shadow: 0 5px 13px rgba(0, 0, 0, 0.15) inset;
box-shadow: 0 5px 13px rgba(0, 0, 0, 0.15) inset;

    /* inline: */
    background-position: 0 -182px;
     -webkit-transition: all .1s;
    -moz-transition: all .1s;
    -o-transition: all .1s;
    transition: all .1s;
}
#menu a:hover {
    -webkit-transform: scale(1.3);
    -ms-transform: scale(1.3);
    transform: scale(1.3);
    -webkit-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
}