How do I disable the shadow only on one edge?

How do I get rid of the shadow in the red area below? I have seen other similar questions but don't know how to apply that here.

Live Demo: http://jsfiddle.net/xFa9M/

CSS:-

#list li{
border: 2px solid black;
border-top-width: 1px;
border-bottom-width: 1px;
padding: 4em;
z-index: 1;
}

#list li .tip{
position: absolute;
left:开发者_如何学Go 200px;
top: 0px;
border: 2px solid black;
border-left-width: 0px;
z-index: 0;
display: none;
}

#list li:hover{
-moz-box-shadow: -5px 5px 5px black;
-webkit-box-shadow: -5px 5px 5px black;
box-shadow: -5px 5px 5px #555;
}

#list li:hover .tip{
-moz-box-shadow: -5px 5px 5px black;
-webkit-box-shadow: -5px 5px 5px black;
box-shadow: -5px 5px 5px #555;
 }

Html:-

<ul id="list">
        <li class="top">About Me
            <div class="tip">Asas</div>
        <li>Garage
        <li class="bottom">My Blog
</ul>

Please note that it is ok for me to use JS code tricks, if needed.

If I understand correctly, you are having problems with the middle li's having shadow, while you only want the first (and maybe last) li to have shadow.

If I understood correctly, you could use the li:first-child and li:last-child to set the shadow to the first and last element of your list.

But this is not the case. If you want to hide the left shadow on your .tip, you should set the first paramater of box-shadow to 0px. The first parameter is the horizontal offset.

Like here: http://jsfiddle.net/rf47W/

Was this what you were looking for?

You cannot.

In order to get around the issue, don't assign dropshadows to the "about me" and "asas" boxes separately, but rather wrap them in a single container and apply the shadow to it.

Have you tried targeting that element with a specific class/id/whatever selector and inserting the code below?

-moz-box-shadow:none;  
-webkit-box-shadow: none;  
box-shadow: none;

The CSS and HTML given does not produce the display shown in the image, so I'm having to guess, but try wrapping the asas box in another box with bottom padding and hidden overflow.