← Tous les exemples

En-tête de tableau fixe

Garde l'en-tête visible lors du défilement des longues listes, pour toujours savoir ce que signifie chaque colonne.

Code à copier

.Polaris-IndexTable__TableHeading,
table[class*="Polaris"] thead th,
.Polaris-DataTable__Cell--header {
  position: sticky !important;
  top: 0 !important;
  z-index: 50 !important;
  background: var(--p-color-bg-surface, #fff) !important;
  box-shadow: 0 1px 0 rgba(0,0,0,0.12) !important;
}

Comment utiliser cet exemple

1. Copiez le code avec le bouton ci-dessus.
2. Installez JustZix (2 minutes) et ouvrez l'extension sur la page cible.
3. Ajoutez une nouvelle règle correspondant à cette page.
4. Collez le code dans le panneau CSS de la règle et enregistrez — l'effet apparaît aussitôt.