Skip to content
  • tcharlss's avatar
    feat: des classes utilitaires pour placer des éléments en sticky dans le privé · c5303e78
    tcharlss a rédigé et marcimat's avatar marcimat a validé
    C'est de l'amélioration progressive purement CSS.
    
    Rappel : pour que ça fonctionne, le parent de l'élément doit avoir une taille supérieure à l'élément en sticky.
    Il ne doit pas y avoir d'ancêtre avec une règle overflow: hidden|auto
    
    Les classes :
    
    * .sticky, .sticky-top, .sticky-bottom : pour coller verticalement
    * .sticky-start, sticky-end : pour coller horizontalement
    * .sticky-m-{n}, n étant un nombre de 1 à 3 : classe à combiner avec les précédentes pour ajouter un espacement
    
    Pour les tableaux on peut également mettre des `<th>` en sticky.
    Les classes sont à mettre sur des lignes `<tr>`, cela évite d'avoir à les mettre sur chaque cellule.
    Les cellules doivent avoir un fond de couleur pour un rendu correct.
    
    * .row-sticky-top : coller verticalement des `<th>` dans le `<thead>` ou le `<tbody>`
    * .row-sticky-start : coller horizontalement des `<th>` dans le `<tbody>` uniquement
    
    On peut combiner les 2 dans un même tableau.
    c5303e78