Discussion :

[GregBond007]

Bonjour,

Je fais appel aux professionnels pour un souci que je vais avoir du mal à expliquer, déjà pour le titre, c'est pas terrible.

Alors voilà, je vous invite à télécharger le petit exemple que j'ai fait : là

Alors ce que je veux, c'est un site qui se redimensionne en hauteur et en largeur donc là je vous ai pris l'exemple du footer que je réitèrerai sur le content et le header si vous trouvez une solution.

Alors voilà, j'ai fait un wrapper (fond noir) qui simule la taille de l'entourage.
à l'intérieur, le footer avec une image simulant un contenu qui s'allonge.

j'ai mis de chaque côté du footer 2 bandes de 30px qui sont donc noires et qui "devraient" être remplies par une image d'entourage de 1px/30px mais cette image ne se répète pas en vertical et même un fond monochrome ne marche pas. Si on lui définit une hauteur, le fond se répète bien sur la hauteur donnée.

Je vois donc que les 2 bandes de 30 px ne sont pas liées au footer et ne se répètent pas vu quelles ne savent pas que son contenu augmente.

J'ai sûrement pas été très clair mais vous aller comprendre avec le fichier mis en lien plus haut.

Vous avez le droit de modifier n'importe quoi tant que ça marche mais j'aimerais rester dans une organisation 3 colonnes :
- 1 fixe avec l'image se répétant à la verticale
- 1 mobile avec le contenu
- 1 fixe avec l'image se répétant à la verticale

Merci d'avance car je suis complètement paumé.

[magnus2005]

Peux tu mettre ta page en exemple directement accessible en web à partir ton répertoire FTP ?

[Candygirl]

Si j'ai bien compris ton problème. il te suffit de pratiquer une inclusion de div et jouer avec le positionnement du fond. Du genre:

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
<div id="gauche">
  <div id="droite">
    contenu
  </div>
</div>

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
#gauche {
  background:url(gauche.png) repeat-y top left;
}
 
#droite{
  background:url(droite.png) repeat-y top right;
  padding:0 30px;
}