Résolu Menu déroulant (avec barre défilement) dans le header

je cite stormalo :  en profiter svp pour voir éventuellement sur d'autre navigateurs que les miens.

j'ai donc essayé sur Chrome mais quand j'attribue les codes à mon module ça ne fonctionne pas.  Par contre ça fonctionne pour "toutes les scrollbars" en mettant une * à la place du  #module......) 

j'ai fait quelques recherches par curiosité, je suis arrivée sur cette page, notamment ce paragraphe pour créer des styles barre de défilement à l'épreuve du temps↗.
Mais idem : pour "toutes les scrollbars" ça fonctionne, pour le module  ça ne fonctionne pas, et idem sur FF,  c'est fou ça !

j'ai pourtant utilisé le bon numéro du #module en question, je ne pige pas pourquoi ça ne fonctionne pas (et pas non plus sur FF)  : une idée stormalo ?

@Pipiou      
merci d'avoir essayé sur d'autres navigateurs (mais j'aimerai bien savoir pour Safari)

Selon les infos sur le web:
Chrome comme Edge fonctionnent sur une même base : Chromium
Firefox fonctionne sur un base propre à Mozilla : Gecko
Donc différences à prévoir, surtout quand Chrome nécessite du css préfixé et que Firefox utilise des propriétés css définies par le W3C

⚠ J'ai eu également quelques soucis avec Edge/Chrome/.... jusqu'à comprendre que pour eux les "-webkit-" sont destinées à former des pseudo-éléments et pas à être des simples sélecteurs.
Conclusion : il ne faut pas d'espace entre l'identifiant du module et les :: 

⚠ Utilisé comme sélecteur le caractère ✱ signifie "tous les éléments html"  (par exemple, #menu * concernerait tous les éléments de la descendance de l'id "menu")

✉ je te propose de tester le code ci-après sur ton blog FunTests (c'est la même structure css que celle que tu as testée sur ce blog)
Note:  overflow: auto; c'est pour que la barre s'affiche automatiquement si le contenu est plus grand que le module, fixé à 100px dans cet essai.

/* ===  essai scrollbar  ST === */

#module_menu_contenu170861495 {
   height: 100px;    overflow: auto;     
/*  ⤵ sera interprété par Firefox  et ignoré par Chrome */
   scrollbar-width: thin; 
   scrollbar-color: blue orange;
  }
/* ⤵ sera interprété par Chrome, Edge, ...  et ignoré par Firefox */
#module_menu_contenu170861495::-webkit-scrollbar {
  width: 12px;
  height: 0px; /* 0 = auto */
}
#module_menu_contenu170861495::-webkit-scrollbar-track {
  background: orange;
}
#module_menu_contenu170861495::-webkit-scrollbar-thumb {
  background-color: blue;
  border-radius: 20px;
  border: 3px solid orange;
}

j'ai testé : ça fonctionne, merci bien !
du coup j'ai personnalisé :)

résultat sur Chrome Edge :
                

résultat sur FireFox :
            

j'ai passé un peu de temps pour essayer de "rendre visible" la scrollbar (sur FireFox) parce qu'elle ne s'affiche que quand je passe la souris sur le module, et disparait peu après :

à priori FF permettrait de ne modifier [scrollbar] que la couleur du fond + la couleur ascenseur et 2 largeurs possibles.

D'ailleurs sur le navigateur/fenêtres Firefox : même comportement ! ceci explique probablement cela.

@ pluuuuuus

@Pipiou,

Le vrai css (celui source W3C) ne permet effectivement que 2 largeurs prédéfinies + les couleurs (glissière et bouton). C'est le cas avec Firefox.
Si de ton coté elle ne s'affiche qu'au survol de la souris c'est qu'il y a un problème avec le css en place sur le blog.

Sur "atelierduchateau.eklablog.com j'ai personnalisé les barres de défilement de deux modules avec des couleurs différentes. Elles apparaissent avec ou sans survol (mais les modules ont une hauteur définie, la propriété owerflow en auto et contiennent un texte plus long que leur hauteur)

Edit au cas où : height: 100px;    overflow: auto;  que j'ai indiqué dans le code c'est uniquement par ce que c'était absent par ailleurs, et qu'un module de hauteur sans hauteur fixe n'aura pas de scrollbar qui s'affiche car il s'adapte au fur et à mesure.
J'ai mis 100px car le texte n'est pas long et que c'est juste pour valider le fonctionnement.