Porte coulissante sans arrière-plan CSS

Question

Est-il possible d'utiliser le balisage comme celui-ci

<ul> 
    <li><a href="#"><img alt="" src="/image1.jpg"></a></li> 
    <li><a href="#"><img alt="" src="/image2.jpg"></a></li> 
</ul> 

Et faire un effet de porte coulissante? J'ai un peu de CSS qui ressemble à ceci:

ul li { 
    list-style-type: none; 
    margin:0; padding:0; 
} 
li a { 
    display:block; 
    overflow:hidden; 
    width:225px; 
} 
li a img { 
    float:left; 
} 
li a:hover img { 
    float:right; 
} 

Il fonctionne dans FireFox, mais IE7 ne semble pas comprendre le flotteur: gauche/float: bon code. Des idées?

Answer 1

Jetez un oeil à ces articles sur A List Apart et voir s'ils font ce dont vous avez besoin:

• Sliding Doors of CSS
• Sliding Doors of CSS, Part II

Ils ont beaucoup d'autres bons articles si vous ne peut pas dormir comme moi ...

Answer 2

Avez-vous essayé de régler le <li> pour bloquer? Si je me souviens bien, IE avait des problèmes avec les listes, sauf si vous avez explicitement défini les styles.

En aparté: Sliding Doors est un terme qui a un sens différent à ce que vous décrivez - pourrait même jeter certaines personnes au large =)