[Problème] mettre un ' | ' entre des menu

[packmann]

Bonjour,

Je voudrais mettre (plus concrétement, déplacer) un | comme séparateur entre menu

par exemple:

acceuil portail extensions | aide


J'ai suspecté avec firebug, il indique:

<span style="color:#333333; font-weight:bold; padding-left:10px;  padding-right:10px">&nbsp;|&nbsp;</span>

mais sur la page, gestion de template, editer HTML, il est marqué :

<div id="horiz-menu" class="<?php echo $mtype; ?>">

et sur la page de gestion de template, editer CSS, template.css,

#horiz-menu {padding: 10px 7px 0; display: block;}

ul#horiznav.menutop, #horiz-menu ul.menutop {padding: 0;margin: 0;position: relative;z-index:120;float: left;cursor:pointer;}

#horiz-menu li, #horiz-menu li .link {position:relative;display: block;height: 41px;line-height: 41px;}

#horiz-menu li:hover .link, #horiz-menu li.sfHover .link {z-index: 100;cursor: pointer;margin: 0;}

#horiz-menu .link {white-space: nowrap;display: block;float: left;height: 41px;line-height: 41px;font-weight: bold;font-size: 13px;text-decoration: none;z-index: 100;cursor: pointer;padding: 0;}

#horiz-menu li:hover .link, #horiz-menu li.sfHover .link, #horiz-menu li.active .link {z-index: 100;cursor: pointer;margin: 0;}

#horiz-menu ul {list-style: none;padding: 0;margin: 0;}

#horiz-menu li {display: block;float: left;margin: 0  1px;padding: 0;font-weight: bold;}

#horiz-menu li .link span {display: block;padding: 0 10px;height: 41px;}

#horiz-menu li li .link span {display: block;padding: 0 10px;height: 20px;line-height: 20px;}



/* Top Main Menu Dropdowns */

#horiz-menu ul ul {margin: 0;border: 0;padding: 0 10px 4px 5px;}

#horiz-menu li li {margin: 0;}

#horiz-menu li li .link {font-weight: normal;padding: 0;margin: 0;height: 35px;font-size: 12px;display: block;}

#horiz-menu li li .link span {display: block;padding: 0;margin-left: 0;}

#horiz-menu ul ul li, #horiz-menu ul ul li.active, #horiz-menu ul ul li.parent {height: 35px;}

/*#horiz-menu li.parent, #horiz-menu li.active li.parent {z-index: 600;}*/

.menutop li:hover ul, .menutop li.sfHover ul {left: 0;top:8px;}

#horiz-menu ul ul li, #horiz-menu ul ul li.c0, #horiz-menu ul ul li.c1, #horiz-menu ul ul li.c2, #horiz-menu ul ul li.c3 {float: left;width: 184px;padding: 0;}

#horiz-menu li ul, #horiz-menu li ul.columns-1, #horiz-menu .drop-wrap.columns-1 {width: 193px;}

#horiz-menu li ul.columns-2, #horiz-menu .drop-wrap.columns-2 {width: 370px;}

#horiz-menu li ul.columns-3, #horiz-menu .drop-wrap.columns-3 {width: 555px;}

#horiz-menu li ul.columns-4, #horiz-menu .drop-wrap.columns-4 {width: 740px;}

Je n'arrive pas trouver d'ou ça vient ' | ' ...

Merci à vos aides.

[toffffe]

Re : mettre un ' | ' entre des menu

Salut
C'est surement une image soit sur les a ou les li ou encore un border

[XdiZ]

Re : mettre un ' | ' entre des menu

Bonjour,

Vous devez peut être avoir un fichier menu.php qui gère l'affichage de votre menu.
Le | (ça s'appelle un pipe, à prononcer païpe) doit être rajouté automatiquement après chaque item de menu, non ?

[houba_houbi]

Re : mettre un ' | ' entre des menu

Ou il peut venir de ton module de menu où tu peux indiquer un caractère comme séparateur qui doit être actuellement le |

[lefabdu51]

Re : mettre un ' | ' entre des menu

ce ne serait pas un élément de menu de type spéarateur que tu cherches à insérer?

[PieceOfCake]

Re : mettre un ' | ' entre des menu

Je sais pas d'où vient le pipe en question, mais tu ne peux PAS le trouver dans un fichier CSS. Le CSS c'est fait pour "déciorer" la page HTML résultat, il n'y a absolument aucun moyen de rajouter ou enlever du texte (même un caractère) dans un fichier de style. puisque par définition c'est fait pour styler !

Tu n'aurais pas déclarer ton menu comme fil de navigation par hasard ?

[daneel]

Re : mettre un ' | ' entre des menu

Je sais pas d'où vient le pipe en question, mais tu ne peux PAS le trouver dans un fichier CSS. Le CSS c'est fait pour "décorer" la page HTML résultat, il n'y a absolument aucun moyen de rajouter ou enlever du texte (même un caractère) dans un fichier de style. puisque par définition c'est fait pour styler !

Tu n'aurais pas déclarer ton menu comme fil de navigation par hasard ?

Bonjour,

Désolé, avant de d'affirmer, vérifie un peu que tu sois à jour... ajouter du contenu en css, c'est possible !

Le | peut être très bien une bordure gauche ou droit en css, c'est ce que j'ai fait pendant des années avant de passer il y a deux ans sur une méthode en css3.

Les propriétés css3 comme before et after sont utilisés régulièrement pour insérer icônes, images vectorielles en svg et contenu en css : http://memo-web.fr/categorie-css-117.php

Donc seule solution, c'est de vérifier avec Firebug qu'il s'agit bien de la barre verticale ou d'une bordure et qu'elle soit posée dans le code html ou dans la css.

[ghazal]

Re : mettre un ' | ' entre des menu

+1 avec Daneel
un exemple ici :

http://codepen.io/anon/pen/fJrCb

[PieceOfCake]

Re : mettre un ' | ' entre des menu

Avec tout le respect que je te dois si le pipe avait été rajouté par une classe CSS, le pipe serait visible à l'écran mais pas dans la 'vue' Firebug du DOM HTML que montre packmann :

<span style="color:#333333; font-weight:bold; padding-left:10px; padding-right:10px">&nbsp;|&nbsp;</span>

on aurait plutôt quelque chose comme :

<span class="pipe_de_bordure" style="color:#333333; font-weight:bold; padding-left:10px; padding-right:10px"></span>

et là effectivement on pourrait se poser la question et aller chercher dans une feuille de style. Mais je dis et je maintiens qu'on ne trouvera JAMAIS dans une feuille de style quelque chose qui permette de rajouter dans le DOM HTML :

&nbsp;|&nbsp;

parce que tout simplement c'est pas possible, l'attribut CSS content (:before ou :after) n'injecte pas dans le code HTML mais dans le stylage de la page et n'est qu'une extension (pratique ? ou pas) de ce que faisait depuis longtemps déjà les attributs CSS visant à mettre le premier caractère en majuscule ou en minuscule (CSS attribute : text-transform).

Et encore, je ne parle pas de la bataille de puriste envers la séparation entre le contenu et le contenant et du risque de mélange de genre et de confusion qui s'ensuit. La présente discussion n'en étant qu'un infime exemple !

[lefabdu51]

Re : mettre un ' | ' entre des menu

il n'y a absolument aucun moyen de rajouter ou enlever du texte (même un caractère) dans un fichier de style. puisque par définition c'est fait pour styler !

euh désolé de te contredire, mais il est parfaitement possible de rajouter du texte via les fichiers css avec la propriété content....

http://babylon-design.com/css-propriete-content-pseudos-classes-before-after/

@Xdiz
toi tu aimes les anglicismes .. En francais, on appelles cela un tube.
Cela viens du shell linux ou ce caractère sert a "tuber" les programmes C.A.D envoyer la sortie d'un programme vers l entrée d'un autre programme.

@packman : quel est le template utilisé ? parceque je ne suis pas sur que tu puisse me dire a quoi correspond le $mtype.....

Pour moi ce serait un element de menu séparateur car il est dans une balise span entre 2 espaces.....

[tataye]

Re : mettre un ' | ' entre des menu

avant tout :
- lien ?
- template ?
- module de menu ?

c'est peut être tout simplement dans la configuration
mais encore faut il connaitre les outils

[XdiZ]

Re : mettre un ' | ' entre des menu

@Xdiz
toi tu aimes les anglicismes .. En francais, on appelles cela un tube.
Cela viens du shell linux ou ce caractère sert a "tuber" les programmes C.A.D envoyer la sortie d'un programme vers l entrée d'un autre programme.

C'est pas faux. Je ne connaissais pas le terme français, merci pour l'info