28220 sujets

CSS et mise en forme, CSS3

Bonjour à tous,

J'aimerai construire mon site web autour d'un cadre baroque
mais je ne vois pas bien comment m'y prendre et surtout pour que le cadre s'étire avec la page plutôt que de faire un ascenceur à l'intérieur.
Ce n'est pas la première fois que je me retrouve confronté à ce problème qui ma souvent obligé à repenser complètement mes chartres graphiques Smiley confus .
Merci d'avance pour les conseils que vous pourrez m'apporter.

Tom Smiley biggrin Smiley biggrin Smiley biggrin upload/3494-cadreBaroqu.jpg
Modifié par erehcab (24 Jan 2006 - 15:09)
Administrateur
Bonjour,

il va falloir trouver un élément se répétant à l'infini, au besoin en modifiant le graphisme de départ.
EDIT: c'est beaucoup plus simple avec une frise grecque Smiley ravi
Modifié par Felipe (24 Jan 2006 - 15:07)
Merci pour ta réponse, si je découpe mon cadre en 4 parties :
- Une partie supérieur, qui restera fixe.
- Deux parties qui pourront ce dupliquer.
- La partie inférieur, qui restera aussi fixe.
Les parties duplicables pourraient être celle-ci : upload/3494-eltInfini.jpg
Qu'en penses-tu ?
Modifié par erehcab (24 Jan 2006 - 15:18)
salut,

Ben c'est plutôt à toi de nous le dire Smiley cligne

si tu nommes cette image cadre_centre.jpg alors fait le test suivant.

html

<div>blablabla</div>


css

div {
height:1000px;
background:url(cadre_centre.jpg) repeat-y left;
}


Tu seras fixé tout de suite je pense
Modifié par clb56 (24 Jan 2006 - 15:25)
Nickel ca le fait carément, c cool Smiley biggrin Smiley biggrin Smiley biggrin .
Je te remercie.
Pourrais-tu m'indiquer comment faire pour réaliser le cadre complet en utilisant du code css comme celui que tu viens de me montrer avec " repeat y",
en utilisant bien sur une image pour le haut, une pour le bas, et une pour le côté droit.
En faite je positionne trois div (sans compter le dessus eet le bas pour l'instant).


html:

<div class="left"></div>
<div class="contenu"></div>
<div class="right></div>




css:

div.left{
	height:1000px;
	background:url(cadre_gauche.jpg) repeat-y left;
}
div.right{
	height:1000px;
	background:url(cadre_droit.jpg) repeat-y right;
}
div.contenu{
	text-align: justify;
        width: 40%;
}



Mais mon problème est qu'ils se mettent les un à la suite des autres, je ne connait pas les commandes css qui me permettront de les mettre les un à côté des autres.
Modifié par erehcab (24 Jan 2006 - 15:56)
En fait ce n'est pas trop ça la méthode avec les css.

Pour pouvoir continuer tu as besoin auparavant de construire un document html un peu complet même s'il reste léger.

Un exemple :


<body>

<div id="conteneur">
<h1 id="header">Titre</h1>

<div id="contenu">
<h2>sous titre</h2>
<p>blablabla</p>
etc..

etc..
</div>

<p id="footer">
Et voilà c'est fini
</p>
</div>

</body>


comme tu peux le voir c'est très léger mais au moins cela commence à ressembler à un document html un peu formé.

C'est bien là dessus que l'on peut maintenant commencer à réfléchir si on trouve une css permettant d'onbtenir le résultat souhaité.

à mon avis c'est oui, mais on en reparle un peu plus tard si tu veux bien parce que là je suis à la bourre (j'ai des cours à donner)