[résolu] Problème de float avec <dl>

Voilà encore un problème de float avec une liste <dl> qui ne fonctionne pas sous IE.

Ces éléments: une image qui float à gauche et du texte à droite se répètent plusieurs fois pour un tutorial. Exemple: http://www.fireworkszone.com/index.php?root=2&extension=1&idTutorial=157

code css

dl.thumbnails {
padding: 0 15px;
margin: 15px;
	}

dl.thumbnails:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
	}
	
dl.thumbnails dt {
margin: 0 0 .5em 0;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 130%;
color: #693;
	}

dl.thumbnails dt img {
	float: left;
	margin: 0 15px 0 0;
	padding: 0 4px 4px 0;	
	border: 1px solid #B1C19E;
	}

dl.thumbnails dd {
margin: 0 0 20px 0;
font-size: 100%;
line-height: 1.5em;
}

Et puis le code XHTML

<dl class="thumbnails">
<dt><img src="extensions/156/pic1.gif" />Step 1</dt>
<dd>After writing a text <strong>(pic 1)</strong> on the canvas convert it to Paths (Ctrl+Shift+P) then Ungroup it (Ctrl+Shift+G)</dd>
</dl>

<dl class="thumbnails">
<dt><img src="extensions/156/pic2.gif" />Step 2</dt>
<dd>Make a new layer and draw a circle with the relevant tool. (Although it would work on the same layer it just makes life easier when you come to shift things about). Make sure that only the circle is selected. <strong>(pic 2)</strong></dd>
</dl>

<dl class="thumbnails">
<dt><img src="extensions/156/pic3.gif" />Step 3</dt> 
<dd>Use the 'Fisheye' command. After a short time, (depending on the speed of your computer) you should see something similar to <strong>pic 3</strong>.</dd>
</dl>

On dirait que le clear:both ne fonctionne pas ? Une dernière précision: les dimensions des photos : 199 x 199 px


Merci
Modifié par fireworkszone (16 Jun 2006 - 14:01)

Oouf, j'ai trouvé les hacks pour faire marcher cette présentation