A disposição dos botões ancoras da classe tópicos no formato tablet 1024px, ficaram todos em uma única linha e no figma estão em duas linhas ficando 4 links em cada linha em uma ordem diferente do mobile.
A disposição dos botões ancoras da classe tópicos no formato tablet 1024px, ficaram todos em uma única linha e no figma estão em duas linhas ficando 4 links em cada linha em uma ordem diferente do mobile.
hoje, com a Alura e o Google Gemini
Olá, Etiene! Tudo bom com você?
Acredito que se você diminuir um pouco o width da lista de tópicos, deve forçar o wrap dos elementos e colocar eles em duas linhas. Verifica também se o flex-wrap está ativado, pra não ter erro. Esse daqui é o meu código do curso, caso você queira dar uma olhada e ver se te ajuda de alguma forma:
@media screen and (min-width: 1024px){
.topicos__titulo, .topicos__item_link{
font-size: 24px;
}
.topicos__lista{
width: 80%;
margin: auto;
}
.topicos__item_link:hover{
background-color: var(--branco);
color: var(--laranja);
}
Espero ter ajudado. Abraços!
Olá Iury! Estou bem sim. E vc?
Seu código me ajudou, obrigada. Fiz outras modificações e fiquei satisfeita com o resultado final.
@media screen and (min-width: 1024px){
.topico__titulo, .topico__link {
font-size: 24px;
}
.topico__lista{
width: 80%;
margin-left: 6em;
}
.topico__lista li:nth-child(6){
order: 8;
}
.topico__lista li:nth-child(7){
order: -1;
}
.topico__lista li:nth-child(1){
order: -1;
}
.topico__item{
padding: 0.5em 0;
}
}
Vou bem também, Etiene, muito obrigado!
Maravilha que deu tudo certo! Bons estudos e abraços!