Ça merdoie !

Juste pour voir, j’ai voulu, sur la page des archives de ce blog, permettre de modifier le tri des mots-clés — actuellement triés par fréquence d’utilisation — par ordre lexicographique. Pour l’instant, un petit bout de Javascript, qui réagit sur un clic sur le titre de cette section et qui fait le job attendu :

/*global $ */
'use strict';

$(document).ready(function() {
  $('#arch-by-tag h3').click(function() {
    const ul = document.getElementsByClassName('arch-tag-list')[0];
    Array.from(ul.getElementsByTagName('LI'))
      .sort((a, b) => a.textContent.localeCompare(b.textContent))
      .forEach(li => ul.appendChild(li));
  });
});

Ça fonctionne très bien, la liste est triée comme attendu sauf que…

… la coupure des mots se fait au niveau de tous les mots composés et ce quelle que soit la place encore disponible en fin de ligne !

Bug de césure

C’est étrange, non ?

Quelqu’un a une idée de ce qui se passe et comment je pourrais y remédier ?


J’ai demandé ce matin sur ##openweb (IRC), si quelqu’un comprenait le souci et finalement Karl m’a expliqué d’où venait le souci. En fait les éléments de la liste étaient stylés en display: inline, et se comportaient donc comme des mots, collés les uns aux autres si on fait abstraction du padding-right: 1em.

Du coup un changement en display: inline-block et tout rentre dans l’ordre \o/

Merci Karl !

Ajouter un commentaire

Les commentaires peuvent être formatés en utilisant une syntaxe wiki simplifiée.

Ajouter un rétrolien

URL de rétrolien : https://open-time.net/trackback/13957

Haut de page