Problême de design galerie photo en css

Bonjour,



bonsoir!

j'ai un probl^me avec la galerie photo de mes membre!

le mieu c'est que vous voyez par vous même!


voici le http://www.uncupidon.com


j'aimerai que les mini photo s'affiche en ligne sans depasser le cadre blanc,

et donc rajouter une barre de defilement horizontal juste en dessous des photo afain de pouvoir toute les visualiser!

merci d'avance de votre aide!


voici le code css :


div#galerie
{
width: 410px ;
background: #eed ;
border: 1px solid #dcb ;
padding: 15px ;
margin: 15px 30px ;
text-align: center ;
font: 0.9em Georgia, serif ;
}

ul#galerie_mini
{

border: 4px groove teal;
padding: 1px;/* Marge interieur du cadre */
margin: 0 ;
padding: 0 ;
list-style-type: none ;
overflow: auto;
}

ul#galerie_mini li
{
float: left ;
}

ul#galerie_mini li a img
{
margin: 2px 1px ;
border: 1px solid #dcb ;
}

dl#photo
{
clear: both ;
margin: 0 auto ;
}

dl#photo dt
{
font: italic 2.5em/1.5em Georgia, serif ;
color: #dcb ;
}

dl#photo dd
{
margin: 0 ;
}

dl#photo img
{
border: 1px solid #dcb ;
}








Code : PHP


<div id="galerie">
<ul id="galerie_mini">
<?php echo '<li><a href="images/'.$donnees0['photo1'].'" title="'.$donnees0['commentaire1'].'"><img src="images/'.$donnees0['photo2'].'" alt="'.$donnees0['commentaire1'].'" /></a></li>'; ?>
<?php echo '<li><a href="images/'.$donnees0['photo3'].'" title="'.$donnees0['commentaire2'].'"><img src="images/'.$donnees0['photo4'].'" alt="'.$donnees0['commentaire2'].'" /></a></li>'; ?>
<?php echo '<li><a href="images/'.$donnees0['photo5'].'" title="'.$donnees0['commentaire3'].'"><img src="images/'.$donnees0['photo6'].'" alt="'.$donnees0['commentaire3'].'" /></a></li>'; ?>
<?php echo '<li><a href="images/'.$donnees0['photo7'].'" title="'.$donnees0['commentaire4'].'"><img src="images/'.$donnees0['photo8'].'" alt="'.$donnees0['commentaire4'].'" /></a></li>'; ?>
<?php echo '<li><a href="images/'.$donnees0['photo9'].'" title="'.$donnees0['commentaire5'].'"><img src="images/'.$donnees0['photo10'].'" alt="'.$donnees0['commentaire5'].'" /></a></li>'; ?>

</ul>


<dl id="photo">
<dt>Titre de la photo 1</dt>
<<dd><img id="big_pict" src="images/" alt="Photo 1 en taille normale" /></dd>
</dl>
</div>