3
respostas

Problemas na criação <li>html

Olá pessoal!!

Estou tentando criar uma lista em meu HTML5, assim:

    <ol>
        <li>Olá</li>
        <li>Teste</li>
        <li>Testando</li>
        <li>Alooooooooooo</li>
    </ol>
</nav>

Quero que apareça assim:

  1. Olá
  2. Teste 3.Testando 4.Alooooooooo

Sendo que está aparecendo uma letra em cima da outra e não aparece o número.

Estou tentando acertar no css , mas sem sucesso.

Vejam meu css:

nav.listaNovidades {
    background-color: lightgrey;
    line-height: 50px;
    text-align: left;
    margin-bottom: 10px;

}

Alguém poderia me ajudar.

Obrigada, Flávia

3 respostas

Oi Flávia eu editei suas regras css, mas não consegui entender direito, você quer que apareça o 1.olá em uma linha e o restante em outras linhas ? Me confirma se é isso e Posta seu arquivo completo e qual o navegador que você está utilizando pra facilitar a busca pela solução. Por que se eu fizer apenas:

<nav>
     <ol>
        <li>Olá</li>
        <li>Teste</li>
        <li>Testando</li>
        <li>Alooooooooooo</li>
    </ol>
</nav>

Tenho esse resultado:

  1. Olá
  2. Teste
  3. Testando
  4. Alooooooooooo

Fico no aguardo.

Quero que apareça exatamente como postou. Sendo que quando abro meu html direto ele abre assim, mas quando abro por dentro do projeto a lista fica com as letras em cima das outras. Resolvi retirando a lista e colocando como paragrafo, pois não faz sentido o que estava ocorrendo.

Muito obrigada. Flávia

Oi Flávia, Pra aparecer como eu postei o código é somente esse:

<nav>
     <ol>
        <li>Olá</li>
        <li>Teste</li>
        <li>Testando</li>
        <li>Alooooooooooo</li>
    </ol>
</nav>

Será que você não esqueceu de abrir a tag nav?

Como você não postou o restante não tenho como saber se tem algum outro erro que influencie neste.Também não consegui entender essa parte:

, mas quando abro por dentro do projeto a lista fica com as letras em cima das outras.

Acredito que a nossa página deve ser a mais semântica possível então trocar uma lista ordenada por parágrafos é uma solução paliativa. Mas se você quiser que eu continue ajudando a investigar estarei por aqui, caso contrário você pode marcar o tópico como solucionado.