Como tantas coisas CSS, há todo tipo de coisa para saber, até algo tão minúsculo quanto centralizar um marcador de lista.
Um leitor escreveu com uma captura de tela do que estavam tentando realizar - basicamente uma lista ordenada (
- ) com os marcadores de lista (1., 2., 3., etc) no topo do conteúdo da lista e centralizados. Na captura de tela, o texto estava centralizado, mas os números não. Então, vamos centralizar esses números!
A primeira coisa a saber é que list-style-positionprecisa ser inside. Isso dará início à festa de centralização. Se fizermos uma pausa antes do conteúdo, estamos praticamente lá. No vídeo, brincamos usando o ::markerpara fazer isso, enquanto encontramos limitações e exploramos todas as ideias.
Os dados de suporte deste navegador são do Caniuse, que tem mais detalhes. Um número indica que o navegador oferece suporte ao recurso nessa versão e superior.
Área de Trabalho
| cromada | Raposa de fogo | IE | Beira | Safári |
|---|---|---|---|---|
| 86 | 68 | Não | 86 | 11,1 |
Celular / Tablet
| Android Chrome | Android Firefox | Android | iOS Safari |
|---|---|---|---|
| 88 | 85 | 81 | 11,3-11,4 |