Cadre étiralble en largeur et en hauteur

Bonjour

Je souhaite créer un div dans laquelle, j'ai un cadre étirable en largeur et en hauteur, avec une largeur minimum.

voici ce que j'ai commencé à faire:

code html:

<div class="haut_cadre_contenu_gauche"><span>&nbsp;</span></div>
                    <div class="centre_cadre_contenu_gauche"><span>&nbsp;</span></div>
                    <div class="bas_cadre_contenu_gauche"><span>&nbsp;</span></div>

code css

.haut_cadre_contenu_gauche{
    /* Sliding right image */
background:url('../images/haut_cadre_contenu_fixe.jpg') no-repeat scroll top right; 
display: block;
float: left;
height: 9px; /* CHANGE THIS VALUE ACCORDING TO IMAGE HEIGHT */
padding-right: 6px; /* CHENGE THIS VALUE ACCORDING TO RIGHT IMAGE WIDTH */
/* FONT PROPERTIES */


}

.haut_cadre_contenu_gauche span {
/* Background left image */ 
background:url('../images/haut_cadre_contenu_etirable.jpg') no-repeat; 
display: block;
line-height: 9px; /* CHANGE THIS VALUE ACCORDING TO BUTTONG HEIGHT */
min-width:312px;
} 


.centre_cadre_contenu_gauche{
    /* Sliding right image */
background:url('../images/centre_cadre_contenu_fixe.jpg') repeat-y scroll top right; 
display: block;
float: left;
height: 100%; /* CHANGE THIS VALUE ACCORDING TO IMAGE HEIGHT */
padding-right: 6px; /* CHENGE THIS VALUE ACCORDING TO RIGHT IMAGE WIDTH */
/* FONT PROPERTIES */
clear:both;

}

.centre_cadre_contenu_gauche span {
/* Background left image */ 
background:url('../images/centre_cadre_contenu_etirable.jpg') repeat-y; 
display: block;
height: 100%; /* CHANGE THIS VALUE ACCORDING TO BUTTONG HEIGHT */
min-width:312px;
clear:both;
} 


.bas_cadre_contenu_gauche{
    /* Sliding right image */
background:url('../images/bas_cadre_contenu_fixe.jpg') no-repeat scroll top right; 
display: block;
clear:both;
float: left;
height: 5px; /* CHANGE THIS VALUE ACCORDING TO IMAGE HEIGHT */
padding-right: 6px; /* CHENGE THIS VALUE ACCORDING TO RIGHT IMAGE WIDTH */
/* FONT PROPERTIES */
}

.bas_cadre_contenu_gauche span {
/* Background left image */ 
background:url('../images/bas_cadre_contenu_etirable.jpg') repeat-y; 
display: block;
clear:both;
line-height: 5px; /* CHANGE THIS VALUE ACCORDING TO BUTTONG HEIGHT */
min-width:312px;
} 

merci pour votre aide

Bonjour,

Pas sûr d'avoir bien compris. Un petit dessin pour illustrer ce que tu souhaites obtenir ?