Entrar Ainda não tem acesso?
Solucionado (ver solução)
Solucionado
(ver solução)
4
respostas

[DÚVIDA]- MARGEM NO .tópicos__item NÃO FUNICONA

Referente ao curso HTML e CSS: responsividade com mobile-first, no capítulo Integrando o Carrossel com SwiperJS e atividade Lista de tópicos

por Luan Pessoa da Motta
| 23.2k xp | 3 posts
.tópicos {
    background: var(--azul-degrade);
    text-align: center;
    padding: 1em 0;
}

.tópicos__titulo {
    color: var(--branco);
    font-weight:300;
    margin-bottom: 1em;
}

.tópicos__listas {
    display: flex;
    flex-wrap: wrap;  /*Faz a quebra de linha do flex-box*/
    justify-content: center;

}

.tópicos__item {
    margin: 2em 0.5em;
}

.tópicos__link {
    color: var(--branco);
    padding: 1em;
    background-color: var(--laranja);
    text-decoration: none;
    font-size: 14px;
    font-weight: 700;
}

Insira aqui a descrição dessa imagem para ajudar na acessibilidade

4 respostas
por Luan Pessoa da Motta
| 23.2k xp | 3 posts

Insira aqui a descrição dessa imagem para ajudar na acessibilidade

Os tópicos não ficam iguais ao do exercício de jeito nenhum e não consigo entender o pq

solução!
por Victor Costa Santos
| 2065k xp | 4023 posts
Alura Scuba Team Monitor do suporte educacional

Olá Luan!

Realizando os teste aqui uma forma que encontrei de solucionar foi mudando o nome de .tópicos__listas para .tópicos__lista, só tirando o s que voltou a funcionar, testa ai e me fala, caso o erro persista preciso de maiores detalhes a respeito do erro, seu código completo fica assim:

.tópicos {
    background: var(--azul-degrade);
    text-align: center;
    padding: 1em 0;
}

.tópicos__titulo {
    color: var(--branco);
    font-weight:300;
    margin-bottom: 1em;
}

.tópicos__lista {
    display: flex;
    flex-wrap: wrap;  /*Faz a quebra de linha do flex-box*/
    justify-content: center;

}

.tópicos__item {
    margin: 2em 0.5em;
}

.tópicos__link {
    color: var(--branco);
    padding: 1em;
    background-color: var(--laranja);
    text-decoration: none;
    font-size: 14px;
    font-weight: 700;
}

Espero ter ajudado e reforço que em casos de dúvidas, conte sempre com o fórum da comunidade Alura! Bons estudos!

Sucesso ✨

Um grande abraço e até mais!

Caso este post tenha lhe ajudado, por favor, marcar como solucionado ✓. Bons Estudos!
por Luan Pessoa da Motta
| 23.2k xp | 3 posts

Obrigado pela ajuda meu amigo, mudei mas ainda sim não esta ficando configurado como o do exercício COMO ESTÁ AGORA

COMO DEVERIA FICAR

por Victor Costa Santos
| 2065k xp | 4023 posts
Alura Scuba Team Monitor do suporte educacional

Olá Lucas!

Você marcou como solução algum tempo após o seu comentário. Gostaria de saber se o erro foi resolvido e, se sim, poderia compartilhar conosco como conseguiu resolver? Caso contrário, poderia me enviar o seu HTML? Acredito que o problema esteja nele. Agradeço desde já!

Fico no aguardo e a disposição em caso de permanência de erros!