Entrar Ainda não tem acesso?
Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

footer ficou uma caixa com uma elipse.

Referente ao curso HTML5 e CSS3 II: Turbinando as suas páginas, no capítulo Gradientes e atividade Gradiente no footer

por eduardo rezende cruz
| 109.8k xp | 45 posts
Suporte atendimento 1

Estou quebrando a cabeça nesta parte e não consigo encontrar onde estou errando.

postei o arquivo completo no jsbin

https://jsbin.com/xozuyifamu/edit?html,css,output

abaixo segue só a parte do css do footer.

background-image: radial-gradient(ellipse at bottom left,rgba(60, 29, 61, 0.8)70%, black 25%);

background-image: radial-gradient(ellipse at bottom left,rgba(60, 29, 61, 0.8)70%, black 25%);

    background-repeat: no-repeat;
    color: #F2FFFC;
    padding: 10px;
    clear: both;
    position: fixed;
    bottom: 0;
    left: 0;
    box-sizing: border-box;
2 respostas
por Luiz Fernando Maehana
| 610.1k xp | 403 posts
Desenvolvedor Front-end

Fala Eduardo...

Pelo que vi nos arquivos da aula o CSS ficou assim:


    background-repeat: no-repeat;
    background-image: radial-gradient(ellipse at left bottom,
        rgba(60, 29, 61, 0.8),
        rgba(60, 29, 61, 0.8) 65%,
        black 65%,
        black 70%,
        transparent 70%);
    background-size: 25% 100%;

Abraços!

solução!
por Wanderson Macêdo
| 3964.9k xp | 8086 posts
Instrutor Desenvolvedor

Oi Eduardo, tudo bem? Acontece que a parte preta deveria ficar transparente, entende? Se você trocar o black no final do gradient por transparent, você vai ter o resultado esperado.

background-image: radial-gradient(ellipse at bottom left,rgba(60, 29, 61, 0.8)70%, transparent 25%);

Assim a parte dos 25% não será preenchida com cor alguma e veremos apenas o elipse. Entende?

Desculpa a demora a responder.