Solucionado
Eu fiz de maneira diferente e o resultado final fica igual a resposta do instrutor:
Criei uma classe chamada .tag para colocar as propriedades.
.tag{
padding-bottom: 30px;
border-bottom: 1px solid #ccc;
margin-bottom: 20px;
}Reposta do instrutor:
article {
padding-bottom: 30px;
border-bottom: 1px solid #ccc;
margin-bottom: 20px;
}A questão, isso pode apresentar problemas no futuro ou atrapalhar em algo?
Olá Genesis!
Não há problema algum, é apenas outra maneira de fazer. Você pode manipular um elemento tanto pelo nome da tag HTML, quanto pelo nome da classe ou id que você der a ele.
Espero ter ajudado.
As duas maneiras funcionam, mas é bom ficar atento à alguns detalhes:
Se você utiliza o nome da tag ("article", por exemplo), TODAS as tags da sua página vão assumir aquele estilo.
É por isso que uma boa prática é você associar uma classe ao elemento que você quer editar que represente uma parte da sua página.
Por exemplo:
Se eu tenho uma página com o seguinte trecho
<div>
<h2> Fotos de floresta </h2>
</div>
<div>
<h2> Fotos de Cidade </h2>
</div>Ao estilizar os <h2>, eu quero deixar cada um de um jeito. Então, devo tentar separar de modo que um não influencie o outro. Por exemplo, colocar classes diferentes nos <h2>.
<div>
<h2 class="titulo-floresta"> Fotos de floresta </h2>
</div>
<div>
<h2 class="titulo-cidade"> Fotos de Cidade </h2>
</div>
No arquivo css:
.titulo-floresta {
color: green
}
.titulo-cidade {
color: gray
}Isso pode ser feito de várias maneiras diferentes usando os seletores avançados de CSS, como seletor por filho. Vale a pena dar uma estudada nessa parte.
Abraços