Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

botao não saiu como o esperado

Insira aqui a descrição dessa imagem para ajudar na acessibilidadeccs .cartao__botao{ display: flex; justify-content: center; align-items: center; background-color: #0480DC; width: 40px; height: 40px; border-radius: 10px; font-size: 0.9rem; }

.cartao__botao--play::before{ content:"/e90b"; font-size: 24px; }

.cartao__botao--destaque{ width: 100%;}

.cartao__botao--destaque::before{ margin-right: 8px; }

html

Início

banner do cartão

Vídeo em destaque

HZC - Título

Bruno Lopez

33 minutos

53 visualizações

        </div>
    </article>
</main>
<script src="index.js"
1 resposta
solução!

Oi João, tudo bem?

Desculpa a demora, estou refazendo o curso pra ver se tem alguma questão sem resposta e achei a sua agora.

Tem algumas inconsitências no seu código, como aqui:

.cartao__botao {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #0480DC;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    font-size: 0.9rem;
    justify-self: flex-end;
}

.cartao__botao--play::before {
    content: "\e90b";
    font-size: 24px;
}

.cartao__botao--destaque {
    width: 100%;
    grid-column: span 2;
}

.cartao__botao--destaque::before {
    margin-right: 8px;
}

Dá uma olhada que estão faltando algumas configurações no seu CSS. E você está usando a / errada, veja:

.cartao__botao--play::before {
    content: "/e90b";
    font-size: 24px;
}

Para colocar no CSS você precisa usar a barra invertida \, veja:

.cartao__botao--play::before {
    content: "\e90b";
    font-size: 24px;
}

Essas pequenas coisinhas fazem com que ocorram erros nos seus códigos.

Espero ter ajudado e bons estudos!