28172 sujets

CSS et mise en forme, CSS3

Bonjour a tous !

Je me lance depuis peu dans l'integration de mes designs web. Dans mon dernier, j'ai donc cree une boite avec des bordures, et a l'interieur de la boite le contenu de la page.


	<div id="contenu_conteneur">
		<div id="top_contenu">
		</div>
		
		<div id="contenu_bordure_gauche">
		</div>
		
		<div id="contenu">yep
		</div>

		
		<div id="contenu_bordure_droite">
		</div>

		<div id="bas_contenu">
		</div>
		
	</div>


Vous l'aurez compris, haut et bas contienne les bordures correspondantes, et gauche et droite aussi. Aucune probleme pour top et bottom.

Voila le CSS que j'ai reussi a faire sur FF 3.+ et IE 8 et qui marche parfaitement :



#contenu_bordure_gauche{
display:table-cell;
min-width:37px;
min-height:282px;
background:url('images/contenu_bordure_gauche.png');
}

#contenu_bordure_droite{
display:table-cell;
margin-right:20px;
width:37px;
min-height:282px;
background:url('images/contenu_bordure_droite.png');
}

#contenu{
display:table-cell;
background:white;
width:905px;
min-height:282px;
}


En revanche, ca ne marche pas pour IE7 et inferieur...
j'ai essayer le tout en in-line, le absolute (ca marche mais des que ca change de taille d'ecran, c'est foutu...)
auriez vous une solution ?

Merci d'avance
Bonjour,

Tu te complique sacrément la tache avec tous tes divs.

À partir du moment où ton contenu a une largeur définie (905px plus les bordures), il n'est pas nécessaire de placer les bordures dans des divs séparés. Il te faut juste une image, de 905px+bordure de large sur laquelle tu intègre les bordures, que tu mettra en fond de contenu.
ah ok Smiley lol
il m'a fallu longtemps pour comprendre ce que tu venais de dire.
Effectievement, ca parait beaucoup plus simple...