Forum

Bonjour,
Je souhaite faire une bordure (droite et gauche) graphique pour les modules minis, mais là je coince.

J'ai réussi à faire ceci dans content.css



Mais je ne sais pas comment pour y mettre à la place un .png de 6px sur 1 à droite et une autre de même dimension à gauche.

Si vous avez la solution, merci de me la donner.

A+

Bonjour,

Ce que tu peux essayer c'est de créer un .png de la largeur de ta boite, 200px donc, comportant de chaque côté les bordures que tu veux et au milieu ta couleur de fond actuelle. Tu le fais de quelques pixels de hauteur, peu importe, puis tu le déclares dans ta CSS en background de ta classe avec un repeat-y, ce qui donnerait un truc de ce style :

Merci pour ta réponse rapide.
C'est effectivement ce vers quoi je m'oriente, mais le problème reste entier pour les modules dont la largeur est relative à la taille de la fenêtre !

Euh non. Les modules, comme les mini-modules, utilisent les CSS, il est donc tout à fait possible d'en fixer la largeur.

Mais je ne veux pas la fixer justement.

J'ai un peu du mal à suivre ce qu'il se passe. Qu'est-ce qui a été fait ? Qu'est-ce qui manque encore ?

Alors je fais un point.
Je souhaite faire une bordure droite et gauche au niveau du content d'un module, mais avec un petit .PNG de chaque côté sans perdre la largeur relative du dit module.



Je pense être plus clair ainsi.

Ah mais c'est pas u mini-module ça. Mais peu importe, pour faire sans bloquer la largeur, je pense qu'il faut modifier les fichiers de template pour reconstruire la partie centrale du module avec des div supplémentaires contenant les .png de bordure.
Par exemple, si tu ouvres le fichier articles.tpl, il faudrait ajouter des div avec tes bordures avant le div module_contents, des div ayant les attributs float:left et float:right.
Il y a surement une autre façon de faire mais je ne la connais pas.

Édité par Shadow Le 19/08/2008 à 14h45

Sans modifier le code HTML je ne pense pas que ce soit faisable...
Mais je ne suis pas un spécialiste en HTML/CSS, donc on va laisser la parole aux spécialistes.

Pas faisable sans toucher aux template à mon avis, donc au HTML effectivement. Dans une même classe CSS, on peut mettre une image en background mais pas deux images de part et d'autre de l'élément.

Merci de votre aide et j'espère que quelqu'un a un solution.

Édité par Hervé-PCS Le 19/08/2008 à 14h52

Je viens de penser qu'on ne peut pas mettre d'image qui se répète verticalement dans un div, j'ai été confrontée à ce problème récemment, j'ai été obligée de faire un tableau, ce n'est pas très "puriste" comme méthode mais ça marche.
Mais, comme je disais, ça nécessite de modifier les fichiers de template et même plusieurs pour refaire la même chose.
Comment te débrouille-tu en HTML ?

J'ai un niveau très faible, et c'est bien mon problème.

Tu t'es basé sur quel thème ?

Peut être que sur les attribue coté CSS y sont déjà il resterai a créer une image type border.png puis l'ajouter dans les css approprié avec , comme la expliquer Shadow , un float .

Je suis parti du thème main2