Bonsoir à vous,
N'ayant pas trouvé la réponse sur ce forum après avoir recherché, je post ici, en espérant que le sujet n'a pas déjà été traité à maintes reprises ^^'
Alors voilà mon soucis, j'ai besoin d'une sorte de cadre destiné à contenir du texte.
Ce cadre doit être extensible en hauteur et en largeur.
Le cadre est généré en php, donc la largeur lui est donnée, mais peut varier.
Il est découpé en 9 images, 8 pour les bords, et l'image centrale.
N'étant pas un pro du CSS, je vous prie d'être indulgents =)
Voilà ce que j'ai laborieusement tenté de faire, mais n'utilisant pas les 'position', je pense que c'est pas prêt de fonctionner (le soucis, c'est que j'ai du mal avec ce concept ^^')
J'ai mis les styles directement dans les balises le temps de faire marcher la chose.
Je suis très loin du compte mais je désespère...
Le $width+36 correspond à la largeur du conteneur du texte + des deux images des bords gauche et droit, ayant chacun pour largeur 18 px.
En espérant avoir été suffisament compréhensible.
Merci d'avance pour votre aide, je galère vraiment là dessus...
Modifié par Ultim4T0m (12 Nov 2007 - 02:44)
N'ayant pas trouvé la réponse sur ce forum après avoir recherché, je post ici, en espérant que le sujet n'a pas déjà été traité à maintes reprises ^^'
Alors voilà mon soucis, j'ai besoin d'une sorte de cadre destiné à contenir du texte.
Ce cadre doit être extensible en hauteur et en largeur.
Le cadre est généré en php, donc la largeur lui est donnée, mais peut varier.
Il est découpé en 9 images, 8 pour les bords, et l'image centrale.
N'étant pas un pro du CSS, je vous prie d'être indulgents =)
Voilà ce que j'ai laborieusement tenté de faire, mais n'utilisant pas les 'position', je pense que c'est pas prêt de fonctionner (le soucis, c'est que j'ai du mal avec ce concept ^^')
J'ai mis les styles directement dans les balises le temps de faire marcher la chose.
Je suis très loin du compte mais je désespère...
<div style="height: 30px; width: '.($width+36).'px; background-image:url(./bord_haut.gif);">
<div style="float:left; width: 18px;"><img src="./gauche_haut.gif" /></div>
<div style="float: right; width: 18px;"><img src="./droite_haut.gif" /></div>
</div>
<div style="min-height: 100px; background-image:url(./centre_centre.gif); width: '.($width+36).'px; margin: auto; ">
<div style="float:left; min-height: 100px; width: 18px; background-image:url(./bord_gauche.gif);"></div>
Affichage du contenu ici
<div style="float: right; min-height: 100px; width: 18px; background-image:url(./bord_droit.gif);";></div>
</div>
<div style="height: 30px; width: '.($width+36).'px; background-image:url(./bord_bas.gif);">
<div style="float:left;"><img src="./gauche_bas.gif" /></div>
<div style="float: right;"><img src="./droite_bas.gif" /></div>
</div>
Le $width+36 correspond à la largeur du conteneur du texte + des deux images des bords gauche et droit, ayant chacun pour largeur 18 px.
En espérant avoir été suffisament compréhensible.
Merci d'avance pour votre aide, je galère vraiment là dessus...
Modifié par Ultim4T0m (12 Nov 2007 - 02:44)
