28221 sujets

CSS et mise en forme, CSS3

bonjour,

je desire faire un cadre coin arrondi avec à l'interieur des photos miniatures.

J'ai reussi à faire cela, mais mon probleme, vient du fait que les miniatures à linterieur du cadre sont toutes collées les unes aux autres, pas d'espacement horizontal ni vertical.

Je vous colle ci dessous mon code :



<dl class='dl_530'>
<dt class='dt_haut' align=right><img id='droitehaut' src='images/css_var_hautdroit.gif' alt='' /><IMG id='titre' src='images/css_images.gif'>
</dt>
<dd class='dd_milieu_530'>
<a href='showme.php' style='text-decoration: none' target='_blank'><img src='galeries/3/thumbs/00760752_m.jpg' border='0' alt='Cliquez' ></a>
<a href='showme.php' style='text-decoration: none' target='_blank'><img src='galeries/3/thumbs/00964899_m.jpg' border='0' alt='Cliquez' ></a>
<a href='showme.php' style='text-decoration: none' target='_blank'><img src='galeries/3/thumbs/02029689_m.jpg' border='0' alt='Cliquez' ></a>
<a href='showme.php' style='text-decoration: none' target='_blank'><img src='galeries/3/thumbs/02167585_m.jpg' border='0' alt='Cliquez' ></a>
</dd>
<dd class='dd_milieu_530'>
<a href='showme.php' style='text-decoration: none' target='_blank'><img src='galeries/3/thumbs/00760752_m.jpg' border='0' alt='Cliquez' ></a>
<a href='showme.php' style='text-decoration: none' target='_blank'><img src='galeries/3/thumbs/00964899_m.jpg' border='0' alt='Cliquez' ></a>
<a href='showme.php' style='text-decoration: none' target='_blank'><img src='galeries/3/thumbs/02029689_m.jpg' border='0' alt='Cliquez' ></a>
<a href='showme.php' style='text-decoration: none' target='_blank'><img src='galeries/3/thumbs/02167585_m.jpg' border='0' alt='Cliquez' ></a>
</dd>
<dd class='dd_milieu_530'>
<a href='showme.php' style='text-decoration: none' target='_blank'><img src='galeries/3/thumbs/00760752_m.jpg' border='0' alt='Cliquez' ></a>
<a href='showme.php' style='text-decoration: none' target='_blank'><img src='galeries/3/thumbs/00964899_m.jpg' border='0' alt='Cliquez' ></a>
</dd>
<dd id='bas'><img id='droitebas' src='images/css_var_basdroit.gif' alt='' />
</dd>
</dl>


et voici mon css :


dl, dt, dd { 
margin: 0;
padding: 0;
}
dl {
}
.dl_530 {
width: 530px; 
}
dt {
line-height: 0;
text-align: left; 
}
.dt_haut
{
height: 29px;
background: #fff url(images/css_var_haut.gif) top left no-repeat;
}
dd {
}
.dd_milieu_530
{
text-align: center;
padding: 0 10px; 
background: url(images/css_var_milieu_530.gif) top left repeat-y; 
}
#bas {
height: 14px;
background: #fff url(images/css_var_bas.gif) bottom left no-repeat;
border: 0 none; 
padding: 0; 
}
#titre {
display: block; 
}
#droitehaut, #droitebas { 
float: right;
}


Merci d'avance !!!!!!!!!!!
Modifié le 12 Nov 2004 - 17:13
j'avais essayer ca, en rajouant dans .dd_milieu_530 un margin mais le probleme à ce momment la, c'est qui me fait un ecart en chacun de mes
dd_milieu_530 et donc, mon cadre n'est plus correct, il y a des espacement dans mon cadre aussi .. moi je veux des espacements juste entre mes miniatures donc a linterieur des dd_milieu_530 et pas entre les dd_milieu_530 .