Resolvendo o main

Oi Daniel!

A sua solução de definir uma classe diferente para cada main é válida sim! E também poderia ter sido feita com a propriedade id.

Na programação dificilmente vai ter um certo e um errado. Muito código é escrito de uma forma específica somente por preferência.

Pessoalmente, eu teria dividido o CSS em um arquivo geral contendo a estilização comum de todas as páginas e depois criado um arquivo CSS para cada página contendo suas estilizações específicas. O CSS global seria importado em todas as páginas e o específico somente na página na qual ele é necessário.

Quais os pontos negativos desta abordagem? O número de arquivos aumenta, ou seja, as quantidades de bytes que o usuário vai ter que baixar são maiores (maior tempo de carregamento e mais uso de banda); teria que lembrar de importar o estilo global + estilo específico; se você não tiver acostumado a lidar com muitos arquivos, você pode acabar se perdendo; e outros motivos que devem existir.

Como estou acostumado com esta abordagem e tudo faz mais sentido pra mim quando separo em arquivos diferentes, a "perda de performance" (que sinceramente pra arquivos pequenos não faz diferença) vale a pena pelo meu entendimento do código.

Outras pessoas acham mais fácil trabalhar só com um arquivo e conseguem se localizar bem na hora de construir e dar manutenção no código.

Enfim, parabéns por ter achado uma solução para o problema que você encontrou! Mas se você não gostou da sua solução, sugiro que você tente fazer a segregação do CSS em vários arquivos e lembre-se de importá-los corretamente no head no HTML de cada página. No final, você vai ter praticado as 2 abordagens e conseguirá decidir sozinho qual fez mais sentido pra você.

Espero ter ajudado! Se tiver mais alguma dúvida pode postar aqui!

Fala Eduardo!! Muito obrigado pelo feedback!! Me ajudou muito e como. sou novato no meio fico meio assim de fazer algumas coisas achando ser gambiara! Hahaha!

Obrigado mesmo!

Só uma coisa, por que você usaria o id ao invés do class?

Valeu abraço!

Oi Daniel!

Magina! Estamos aqui pra isso :)

Não se preocupe com gambiarras! No final o importante é estar funcionando, de preferência de uma maneira que você entenda. Com o passar do tempo e com mais experiência você vai conseguir olhar para seu código "gambiarra" e melhorá-lo.

Você viu um problema e está tentando achar uma maneira de resolvê-lo e isso é ótimo! São nesses casos que a gente mais aprende.

Sobre seu questionamento: semanticamente a tag main deve ser única numa página e, como o id também deve ser único, eu o usaria para garantir que o elemento que estou manipulando é de fato o main.

A classe main-contato pode ser aplicada em várias tags erradamente, entretanto a estilização #main-contato seria aplicada somente no <main id="main-contato" >.

Espero ter ajudado! Abraços!

Valeu mais uma vez Eduardo!!

Vou aplicar aqui nos meus exercícios!

Abração!!

Muito bom Eduardo!!!

Gostei da solução, Daniel! Também gostei da discussão/orientação do Eduardo. É sempre bom ter vários pontos de vista.