3
respostas

Problemas com o ::before

Bom dia, pessoal. Fiz o exercício aspas duplas nas citações, porém ao passar o mouse em cima da citação, efeito criado em outra aula, as aspas da segunda citação fica cinza claro enquanto o restante da pagina está com o fundo preto translúcido. Não sei se isso é arrumado mais pra frente do curso, caso sim desconsidere. Não quis deixar para depois, senão acabaria esquecendo de perguntar. Obrigado!

.citacao-bio::before {
    content: '“';
    color: #bbb;
    font-size: 1000%;
    position: absolute;
    line-height: 0.8;
}
.citacao-bio > p {
    position: relative;
}
3 respostas

Oi Cleiton, tudo bem? no seu trecho de código, onde está a pseudo classe :hover?

Ola, tudo sim. Eu segui o curso com este detalhe e percebi que nas aulas do professor esse detalhe continuou. Nesta aula em específico está assim o código:

.citacao-bio:nth-of-type(even):hover,
.citacao-bio:nth-of-type(even):focus {
    box-shadow: 0 0 0 99999px rgba(0,0,0,.8);
    transform: scale(1.2) rotate(-5deg);
}

.citacao-bio:nth-of-type(odd):hover,
.citacao-bio:nth-of-type(odd):focus {
    box-shadow: 0 0 0 99999px rgba(0,0,0,.8);
    transform: scale(1.2) rotate(5deg);
}

Oi Cleiton, seu código parece estar um pouco diferente do projeto real, você poderia comparar e deixar igual pra ver se resolve?

Mas me responde uma pergunta, a cor deveria ficar cinza mesmo, não? Que cor deveria ficar? Não vi em nenhuma parte do código algo pra mudar a cor das aspas.

O link do repositório está aqui: https://github.com/alura-cursos/avancando-html-css/

E o arquivo bio.css é esse aqui: https://github.com/alura-cursos/avancando-html-css/blob/master/css/bio.css