Fiquei sem computador durante um mês e estou retornando ao projeto hoje, estou com dificuldades para fazer com que os itens quebrem e tornem o eixo horizontal.
meu código:
.icones_skills {
display: flex;
flex-direction: row;
justify-content: center;
position: relative;
padding: 2%;
top: 50px;
gap: 20px;
}
Oi, Carlos, tudo bem?
Pelo que entendi, você deseja centralizar os itens horizontalmente e também garantir que eles quebrem de linha quando necessário. No seu código atual, você já configurou o display como flex e o justify-content como center, o que é perfeito para centralizar os itens horizontalmente. No entanto, para permitir que os itens quebrem de linha, você precisa adicionar a propriedade flex-wrap.
Aqui está como você pode ajustar seu código:
.icones_skills {
display: flex;
flex-direction: row;
flex-wrap: wrap; /* Adiciona essa linha */
justify-content: center;
position: relative;
padding: 2%;
top: 50px;
gap: 20px;
}
Com a propriedade flex-wrap: wrap;, os itens dentro do container .icones_skills irão automaticamente quebrar para a próxima linha quando não houver espaço suficiente na linha atual. Isso deve resolver o problema de fazer com que os itens quebrem e mantenham o alinhamento no eixo horizontal.
Espero ter ajudado. Caso tenha dúvidas, conte com o fórum. Abraços!