Eu fiz a atividade e deu o resultado esperado, mas ao ver a opinião do instrutor, vi que ele usou todas as unidades em "em" e eu em "rem"
Segue meu código abaixo:
foto-home {
height: 12.5rem;
}
.titulo-principal {;
font-size: 3.75rem;
padding: 1.875rem;
}
.subtitulo-principal {
font-size: 1.25rem;
}
.secao-inicio .saudacao{
padding: 7%;
}
.saudacao p {
color: #99A;
line-height: 1;
font-size: 1.5625rem;
}
.saudacao-inicio {
color: #889;
font-size: 5.625rem;
}
.saudacao-ultima-linha {
text-align: right;
display: block;
}
.saudacao strong {
color: #000;
font-size: 3.75rem;
}
.saudacao em {
color: #851944;
font-size: 7.5rem;
}
.botao-index {
background-color: #851944;
color: #FFF;
border: .2em solid black;
width: 38ch;
padding: 0.625rem;
display: block;
text-align: center;
margin-bottom: 5.625rem;
margin-left: auto;
margin-right: auto;
font-size: 1.5625rem;
}
.secao-inicio h2 {
text-transform: uppercase;
}
.trabalhos {
background-color: #3C1D3D;
border-top: 0.55em solid #000;
border-bottom: 0.55em solid #000;
padding: 3.6%;
}
.trabalhos h2 {
color: #FFF;
}
.trabalhos ul {
overflow: hidden;
border: 0.55em solid black;
margin-bottom: 3.125rem;
margin-top: 1.5625rem;
}
.trabalhos li {
float: left;
width: 33.333%;
}
.trabalhos img {
width: 100%;
display: block;
}
.blog {
background-color: #999;
color: #FFF;
border-bottom: 0.55em solid #851944;
padding: 3.6%;
}
.blog li a {
color: #FCF;
line-height: 4;
font-size: 1.25rem;
}
footer {
background-color: #000;
color: #FFF;
padding: 3.6%;
font-size: 1.25rem;
}
footer a {
color: #F99;
}
main {
width: 100%;
padding-bottom: 0;
float: none;
}
.blog ol {
padding-bottom: 3.125rem;
padding-top: 3.125rem;
padding-left: 0.625rem;
}
small {
font-size: 1.25rem;
}
h2 {
font-size: 3.75rem;
}Quando devo usar "em" e "rem"?
