Ao modificar as classes secao-horizontal e secao-vertical, no arquivo secao.css, foi adicionado uma vírgula entre elas. Porém ao modificar as classes secao-horizontal e secao__cartoes não há vírgula entre as mesmas. Por quê?
Ao modificar as classes secao-horizontal e secao-vertical, no arquivo secao.css, foi adicionado uma vírgula entre elas. Porém ao modificar as classes secao-horizontal e secao__cartoes não há vírgula entre as mesmas. Por quê?
hoje, com a Alura e o Google Gemini
Oi, Etiene, tudo bem?
Em CSS, você pode definir seletores para vários elementos, agrupando classes separadas por vírgulas. Por exemplo:
.secao-horizontal, .secao-vertical {
grid-template-rows: 70px auto;
}
Neste caso, ambas as classes secao-horizontale secao-verticalrecebem os estilos aplicados no arquivo CSS.
Por outro lado, se temos seletores que não são separados por vírgula como este:
.secao-horizontal .secao__cartoes {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(min(80%/2, max(350px, 80%/3)), 1fr));
gap: 1.25rem;
}
Isso indica que estamos buscando dentro da classe secao-horizontal a classe secao-cartoesque aparece na sequência e estamos aplicando especificamente a ela o estilo definido.
Espero ter ajudado. Caso tenha dúvidas, conte com o fórum. Abraços!