1 reply to this topic

[Stasonix]

look at my fiddle example

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.

[oldhendra]

Like this? I haven't test it but only through my FF8:

ul.ultag li:hover {   box-shadow: 0 0 5px 5px #000000;
  position:relative;
  z-index:10; }

Edited by oldhendra, 17 November 2011 - 12:08 AM.
compatibility