Bonjour,
 
J'ai un problème de décalage de mes divs se trouvant dans dans la div avec l'id "filtercontainer".
J'ai voulu me créer un "select" personnalisé permettant d'ajouter des filtres. À chaque fois que je sélectionne un filtre ça le supprime de la liste déroulante pour l'ajouter à la liste des filtres, cela fonctionne bien, sauf quand il ne reste plus assez de choix car ma liste déroulante diminue alors en hauteur. Mon décalage entré avec une valeur fixe n'est alors plus bon. Auriez vous une idée de comment corriger cela, si ce n'est en forçant la hauteur de mon "select" personnalisé ?
 
code (version finale plus bas)
 
Pour ajouter un filtre cliquez sur "filtre(s) :" ou sur le "+".

Bon j'ai réussi à faire ce que je voulais en rajoutant une couche de JS : code (version finale plus bas)
Mon code est assez dégueulasse je dois dire.

Et ce sera encore pire quand je vais l'intégré à mon code existant parce que la partie HTML va être générée dynamiquement.

EDIT : correction d'un bug + légère simplification du code.

Bon j'ai nettoyé un peu mon JS puis utilisé une technique bien dégueu pour ajouter des bordures à mes "li" sans que le dernier ne possède une bordure redondante avec celle de ma "div" parente. Lorsque je les sélectionne, je ne les supprime pas, je les désactive juste (display: none). Par conséquent, le dernier "li" affiché n'est pas forcément le dernier enfant de la liste, il peut très bien se trouver un autre "li" après mais désactivé. Donc on oublie le last-child en css.
J'ai donc ajouté une ligne "hr" de hauteur nulle, décalée de la hauteur de sa bordure supérieure de couleur blanche qui vient par dessus la dernière bordure affichée.

Je pense que c'est bon de mon côté, le reste ça sera de la mise en forme simple puis intégration à mon code existant.
Remarquez-vous des problèmes ?
Avez-vous une idée pour faire plus simple ? J'ai rapidement regardé après coup ce qui existait en "select" personnalisé et je vois que c'est rarement fait en quelques lignes, donc je suppose que je ne suis pas totalement dans le faux.

code (version finale plus bas)

EDIT : ajout de commentaires pour ceux qui seraient tentés de mettre le nez dans le JS.

Version améliorée et objet : https://codepen.io/Perrier_ChouFleu [...] itors=1111