Bordures, code css

Fermé
virtuellewoman Messages postés 23 Date d'inscription dimanche 18 avril 2010 Statut Membre Dernière intervention 13 décembre 2010 - 6 nov. 2010 à 11:36
virtuellewoman Messages postés 23 Date d'inscription dimanche 18 avril 2010 Statut Membre Dernière intervention 13 décembre 2010 - 13 déc. 2010 à 16:09
Bonjour,

J'aiemrai faire ma page internet en y inserant une bordure a gauche et a droite. J'arrive à la faire à gauche en inserant ce code css " background-repeat:repeat-y; " mais je ne parviens pas a la faire a droite.

Merci de vos réponse, c'est assez urgent !



A voir également:

8 réponses

tu veux fixez la largeur de ta page ?
pour que le contenu ne dépasse pas XXX px ?

tu doit utiliser width
0
virtuellewoman Messages postés 23 Date d'inscription dimanche 18 avril 2010 Statut Membre Dernière intervention 13 décembre 2010
6 nov. 2010 à 12:56
la largeur de la page est déja fixée. J'ai créé une bordure, je l'ai inséré à gauche grace au code css, mais impossible de l'insérer également a droite.

Voici le code css que j'ai inséré et qui me donne la bordure a gauche :
body
{
width: 760px;
margin: auto;
margin-top: 15px;
margin-bottom: 15px;
background-image:url(images/portail.jpg);
background-repeat:repeat-y;

}
0
Walké Messages postés 56 Date d'inscription dimanche 27 janvier 2008 Statut Membre Dernière intervention 2 septembre 2011 21
6 nov. 2010 à 13:48
Alors, en fait, tu as une propriété background-position, dont la valeur par défaut en gros c'est en haut à gauche (top left, ou 0% 0%).

Donc ton image d'arrière plan est en haut à gauche et se répète verticalement. Tu as donc une bordure à gauche.

Pour avoir une bordure à droite, il y a plusieurs solutions :

Première solution
Si c'est la même bordure, de créer une div fille de ta div qui a laquelle tu voulais mettre une bordure (cela m'étonne que tu puisse fixer une largeur à body
Donc imaginons que tu as la div #conteneur et sa fille #contenu
Imaginons que la bordure fasse 5px de large

#conteneur,#contenu{
	background-image:url(images/portail.jpg);
	background-repeat:repeat-y;
	width:760px;
}/*ici j'ai appliqué la largeur et le fond aux deux divs*/

#conteneur{
	padding-right:5px;
	background-position:top right;
}/*là je met 5px d'espace à droite de la div parente, et je met l'arrière plan à droite*/

#contenu{
	background-position:top left;
}/*et là je met mon arrière plan à gauche dans la div fille*/


Si ce n'est pas la même bordure (l'image est retournée) il suffit d'attribuer une autre image pour la div, ou de faire une image-sprite (combiner les mêmes images et jouer avec la position)

Deuxième solution
Créer une image de 760px de large, qui contiendra la bordure gauche ET la bordure droite. Puis il suffit de la répéter sur toute la hauteur.
C'est beaucoup de blanc au milieu pour rien, et ca ne marche que pour une largeur fixe
0
virtuellewoman Messages postés 23 Date d'inscription dimanche 18 avril 2010 Statut Membre Dernière intervention 13 décembre 2010
6 nov. 2010 à 14:57
MErci je vais donc essayer ta premiere solution car le seconde j'y avais pensé mais c du poids par rapport à l'image, et je prefere réussir a trouver une façon par le code pour manipuler les images.
Merci je teste et je reviens dans la soirée pour te tenir au courant.
Dans tous les cas merci de ton aide.
Amicalement
Léa
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
virtuellewoman Messages postés 23 Date d'inscription dimanche 18 avril 2010 Statut Membre Dernière intervention 13 décembre 2010
6 nov. 2010 à 19:54
coucou,

alors j'ai essayé de suivre tes indications car cela me paraissait pas compréhensible...étant novice de la création de site... le plus simple était de tester...enfin du moins d'essayer...et cela n'a pas marché...
Je ne comprends pas trop div fille... Je coule pleinement la ...
J'ai ajouté en fait deux nouvelles div dans ma pahe html et dans mon code css j'ai copier coller tes instructions en ayant baptisé bien entendu à la base conteneur contenu...mais rien n'apparait maintenant...
Au fait, oui c 'est la meme bordure pour les côtés à appliquer...

Merci de ton aide, je vais encore essayer et essayer d'y voir plus clair, j'y perds un peu mon latin....
0
Walké Messages postés 56 Date d'inscription dimanche 27 janvier 2008 Statut Membre Dernière intervention 2 septembre 2011 21
Modifié par Walké le 31/07/2011 à 16:03
Oui j'ai trouvé une solution plus simple.
Nous avons :
* une bordure de 10px de large
* un texte qui doit faire 760px
* les bordures de chaque côté

Je fait une div qui contient le texte. Elle s'apellera #contenu
Je lui applique le background à gauche.
Je met donc 15px de marge intérieur à gauche pour pas que le texte sois sur la bordure.

Je fait une div qui contient la div qui contient le texte, elle s'apellera #conteneur.
Je lui applique le background à droite,
Je met donc 15px de marge intérieur à droite pour pas que le texte sois sur la bordure.
! je met le padding à cette div a cas où il doit y avoir une couleur de fond. Si j'avais mis le padding à la div fille, on aurais vu la bordure de la div d'en dessous à travers elle, mais si on lui mettait une couleur de fond on l'aurais plus vue !
Je met la largeur à 760 + 15 + 15 = 790px
0
virtuellewoman Messages postés 23 Date d'inscription dimanche 18 avril 2010 Statut Membre Dernière intervention 13 décembre 2010
7 nov. 2010 à 10:06
Coucou,
Je te remercie pour le temps que tu as pris pour m'aider, c'est très gentil, je suis hyper touchée... Avec cet exemple cela meparait beaucoup plus claire et je pense que je vais y arriver...Je te tiens au courant dans la journée...Encore merci

Amicalement

Léa
0
virtuellewoman Messages postés 23 Date d'inscription dimanche 18 avril 2010 Statut Membre Dernière intervention 13 décembre 2010
13 déc. 2010 à 16:09
je n'ai pas réussi alors j'ai zappé merci quand meme pour ton aide.
Bisous léa
0