Elenco numeri resi in modo errato

Renderizzerò lo stesso elenco, aumentando il valore di posizione dell’attributo start per ciascuno successivo:

1. Betsy
1. Tacy
1. Tib
1. Naifi

  1. Betsy
  2. Tacy
  3. Tib
  4. Naifi

  1. Betsy
  2. Tacy
  3. Tib
  4. Naifi

  1. Betsy
  2. Tacy
  3. Tib
  4. Naifi

  1. Betsy
  2. Tacy
  3. Tib
  4. Naifi

  1. Betsy
  2. Tacy
  3. Tib
  4. Naifi

  1. Betsy
  2. Tacy
  3. Tib
  4. Naifi

Sono in grado di riprodurlo. È un problema di CSS, in quanto lo spazio predefinito attorno agli elenchi ordinati (<ol>) è normalmente impostato per accogliere numeri più piccoli.

Ho notato che gli stessi elenchi vengono visualizzati in modo diverso per tema, quindi ho creato un componente tematico che ha semplicemente aggiunto:

ol {
  margin-left: 3em;
}

D’altra parte, questo si applica anche a tutti gli elenchi e quando l’elemento non è un numero di 5+ cifre, gli elenchi ordinati sembrano avere troppo spazio…

Il mio suggerimento: applica un componente che corrisponda al tuo uso degli elenchi ordinati sul tuo sito; penso che sia raro estrarre la parte centrale di un elenco molto lungo di elementi e non riesco a immaginare qualcuno che pubblichi elenchi con 10.000 elementi senza incorrere in limiti di caratteri. :slight_smile:

Ho pensato che forse ci fosse un modo per stilizzarlo in modo che un dato elenco si adattasse sempre, ma la numerazione negli elenchi ordinati viene applicata come pseudo-elemento (::marker), e non sono sicuro di come fare calcoli CSS su questi… :thinking:

3 Mi Piace