Solucionado
Ao mudar do tablet para o mobile, o titulo se mantém e não desaparece como deveria ser. alguém saberia como resolver?
Este é o código em CSS.
.container__titulo {
display: none;
}
@media screen and (min-width: 1024px) {
.container__titulo, .container__titulo--negrito {
font-family: var(--fonte-secundario);
font-size: 30px;
}
}
.container__titulo {
font-weight: 400;
display: block;
}
.container__titulo--negrito {
font-weight: 700;
}
hoje, com a Alura e o Google Gemini
O problema está aqui:
.container__titulo {
font-weight: 400;
display: block;
}
O css lê o documento de cima para baixo. No seu caso, você define que o "container__titulo" terá "display: none" como padrão, e logo abaixo da media query diz para ele ter "display:block"
Como o objetivo é esconder o texto no mobile e mostrar o texto nas telas maiores, o código acima deveria estar dentro da media query
Olá André tudo bom? sou aluno e vou tentar ajudar. Pelo que reparei tem uma propriedade display:block que é processado fora do media query e isso acaba por não garantir a mudança pois sempre será carregado independente do tamanho da tela. Acredito que você queria o css
.container__titulo {
font-weight: 400;
display: block;
}estivesse dentro de uma mediaquery ficando assim por exemplo
@media screen and (min-width: 1024px) {
.container__titulo, .container__titulo--negrito {
font-family: var(--fonte-secundario);
font-size: 30px;
}
.container__titulo {
font-weight: 400;
display: block;
}
}espero que ajude e bons estudos