source:
<ul class='ultag'>
<li><span>color 1</span></li>
<li><span>color 2</span></li>
<li><span>color 3</span></li>
</ul>
ul.ultag {
position: absolute; left: 5%; top: 0;
width: 100px;
height: 50px;
border: 2px solid red;
}
ul.ultag li {
width: 99px;
height: 15px;
background-color: lightblue;
float: left;
border: 1px solid grey;
text-align: center;
}
ul.ultag li span {
position: relative; left: 0; top: 0;
display: block;
width: 100%;
height: 90%;
margin-top: -4px;
overflow: visible;
}
ul.ultag li:hover {
box-shadow: 0 0 5px 5px #000000;
}
I need that shadow was over siblings li, so how can I do that? The last li behavior I very like, but the others is... not much.