probleme cadre arrondi

<div class="cadre">
<div class="haut-droit">
</div>
<div class="haut-gauche">
</div>
<div class="contenu">
<fieldset>
<p class="texte-blanc">COMMUNAUTE</p>
</fieldset>
</div>
<div class="bas-droit">
</div>
<div class="bas-gauche">
</div>
</div>
<!-- fin de cadre arrondi -->

/* cadres arrondis */
/* -----------------------------------------------------------------------------------*/

.cadre { /* taille du cadre, à titre d'exemple */
width: 15em;
}
/* propriétés communes à l'ensemble des 4 coins */
.haut-gauche, .haut-droit, .bas-gauche, .bas-droit
{
height: 19px;
width: 19px;
background-repeat: no-repeat;
font-size:1px; /* correction d'un bug IE */
}
/* propriétés spécifiques à chaque coin */
.haut-gauche
{
background:url(gauche.jpeg);
}
.haut-droit {
float: right;
background:url(gauche.jpeg);
}
.bas-gauche
{
background:url(gauche.jpeg);
}
.bas-droit {
float: right;
background:url(gauche.jpeg);
}
.contenu p {

text-align:center;
color:#FFFFFF;
background:url(gauche.jpeg);
margin: 0.5em; /*gestion des espaces interparagraphes */
}