1
resposta

[Dúvida] Mudar a posição do marcador

Boa tarde. Como faço pra mudar a posição do marcador em cada item da lista? Coloquei list-style-position: inside mas não ficou. Aonde estou errando? Agradeço a ajuda!

1 resposta

Olá, Janaina.

Tudo bem?

Para mudar a posição do marcador em cada item da lista, você pode usar a propriedade list-style-position. O valor inside faz com que o marcador fique dentro do conteúdo do item da lista, enquanto o valor outside (que é o padrão) faz com que o marcador fique fora do conteúdo do item da lista.

Se list-style-position: inside não funcionou como esperado, pode ser que haja algum outro estilo interferindo. Vou te dar um exemplo prático para ajudar:

HTML:

<!DOCTYPE html>
<html lang="pt-BR">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Currículo</title>
</head>
<body>
    <h1>Meu Currículo</h1>
    <ul>
        <li>Experiência 1</li>
        <li>Experiência 2</li>
        <li>Experiência 3</li>
    </ul>
</body>
</html>

CSS:

ul{ 
      list-style-position: inside;
}

Neste exemplo, os marcadores das listas estarão dentro do conteúdo dos itens da lista. Lembrando que a diferença pode ser sutil, ele vai ou distanciar mais a bolinha de cada item da lista ou aproximar. Se isso ainda não resolver, verifique se há algum outro estilo CSS que possa estar afetando a lista ou os itens da lista. Qualquer coisa compartilha os seus códigos completos dos arquivos HTML e CSS.

Espero ter ajudado e bons estudos!