Overflow su immagini thumbs

[daweb]

Buongiorno a tutti,

ho appena finito di provare questo tutorial segnalato su EDIT e devo dire che mi piace.

http://cssglobe.com/lab/overflow_thumbs/

Ho solo una domanda: per esigenza del mio layout ho voluto aggiungere una classe .no_margine_destro all'ultimo elemento della mia lista

<style>.no_margine_destro { margin_right: 0; }</style>
<'li' class="no_margine_destro">FOTOGRAFIA<'/li> 

Tutto bene su FF, ma su IE 6 dopo l'hover del mouse si aggiunge un px sul bottom della foto.

Qualche suggerimento?

Questo il codice completo del css


/* thumbnail list */
ul#thumbs, ul#thumbs li{ list-style: none; }
ul#thumbs li{ float: left; margin-right: 5px; margin-bottom: 10px; border: 1px solid #999; padding: 2px; }
ul#thumbs a{ display: block; float: left; width: 79px; height: 70px; line-height: 100px;
overflow: hidden; position: relative; z-index: 1; }
ul#thumbs a img{ float: left; position: absolute; top: -20px; left: -50px; }
/* mouse over */
ul#thumbs a:hover{ overflow: visible; z-index: 1000; border: none; }
ul#thumbs a:hover img{ border: 1px solid #999; background: #fff; padding: 2px; }
/* // mouse over */
/* clearing floats */
ul#thumbs:after, li#thumbs:after{ content: "."; display: block; height: 0; clear: both; visibility: hidden; }
ul#thumbs, li#thumbs{ display: block; }
/* \*/
ul#thumbs, li#thumbs{ min-height: 1%; }
* html ul#thumbs, * html li#thumbs{ height: 1%; }
/* // clearing floats */
/* // thumbnail list */


e questo il markup

<ul id="thumbs">
        [*][url="http://cssglobe.com/"][img]image.jpg[/img][/url]
        <li class="no_margine_destro">[url="http://cssglobe.com/"][img]image.jpg[/img][/url]
        [*][url="http://cssglobe.com/"][img]image.jpg[/img][/url]
        <li class="no_margine_destro">[url="http://cssglobe.com/"][img]image.jpg[/img][/url]
        [*][url="http://cssglobe.com/"][img]image.jpg[/img][/url]
    [/list] 

Grazie