# Números de lista renderizados incorrectamente

**URL:** <https://meta.discourse.org/t/list-numbers-rendered-incorrectly/222266>\
**Category:** Bug\
**Created:** [29 Marzo, 2022 06:58 UTC](https://meta.discourse.org/t/list-numbers-rendered-incorrectly/222266 "2022-03-29T06:58:00Z")\
**Posts on this page:** 1\
**Showing post:** 3

<div class="post-metadata">

**Author:** ![maiki](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/maiki/32/233950_2.png) [@maiki](https://meta.discourse.org/u/maiki)\
**Post date:** [1 Abril, 2022 19:45 UTC](https://meta.discourse.org/t/list-numbers-rendered-incorrectly/222266/3 "2022-04-01T19:45:23Z")

</div>

Voy a renderizar la misma lista, aumentando el atributo start en un valor posicional para cada una subsiguiente:

```plaintext
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

* * *

Puedo reproducirlo. Es un problema de CSS, en el sentido de que el espacio predeterminado alrededor de las listas ordenadas (`<ol>`) normalmente se establece para acomodar números bajos.

Noté que las mismas listas se renderizan de manera diferente según el tema, así que creé un componente de tema que simplemente agregó:

```css
ol {
  margin-left: 3em;
}

```

Por otro lado, esto también se aplica a todas las listas, y cuando el elemento _no_ es un número grande de 5+ dígitos, las listas ordenadas parecen tener demasiado espacio…

 ![Screenshot 2022-04-01 at 12-33-08 Test numbers - Sandbox Discourse Kit](https://global.discourse-cdn.com/meta/original/3X/b/0/b0af34d86dd589bae23c361d586f6e69c3f6a293.png)

Mi sugerencia: aplica un componente que coincida con tu uso de listas ordenadas en tu sitio; creo que es raro extraer el medio de una lista muy larga de elementos, y no puedo imaginar a alguien publicando listas con 10,000 elementos sin encontrar límites de caracteres. 🙂

Pensé que tal vez había una manera de estilizarlo para que una lista dada siempre encajara, pero la numeración en las listas ordenadas se aplica como pseudo-elemento ([::marker](https://developer.mozilla.org/en-US/docs/Web/CSS/::marker)), y no estoy seguro de cómo hacer matemáticas CSS en esos… 🤔

---

_[View the full topic](https://meta.discourse.org/t/list-numbers-rendered-incorrectly/222266)._