Usei o código dado no curso e o html do download, ao aplicar as aspas com o before a minha fica no meio do blockquote, se coloco um com o after sai para fora da caixa. O que acontece?
.citacao-bio::before {
content: '“';
position: absolute;
font-size: 10em;
color: #bbb;
}
.citacao-bio::after {
content: '“';
position: absolute;
font-size: 10em;
color: #bbb;
}
.citacao-bio > p {
position: relative;
}
eu fiz o line-height para posicionar onde eu queria dentro da caixa!
.citacao-bio::before {
content: '“';
position: absolute;
font-size: 10em;
color: #bbb;
line-height: 0.7
Renato, como você esta usando o position: absolute você deve informar as posição que pretende deixar seus elementos: right e left:
Se quiser que o before fique á esquerda e o after á direita, adicione:
.citacao-bio::before {
//...
left: 0;
}
.citacao-bio::after {
//...
right: 0;
}Espero ter ajudado.
Boa tarde Renato, minha " também ficou quase no centro do blockquote e para resolver esse problema coloquei o line-height: .7, com isso ele apresentou corretamente.
.citacao-bio::before {
content: '"';
font-size: 10em;
color: #bbb;
position: absolute;
line-height: .7;
}