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!
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
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!
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!