1
resposta

Erro na visualização do Footer - Patrocinadores

Boa tarde, olha eu novamente ':D

Então, to enfrentando um erro na visualização do footer, na seção de patrocinadores e do formulário. Estas seções estão 'extrapolando' o meu body. Fui ver o meu código, mas está igual ao do curso. Baixei o código do curso (o código final), quando abri, vi que estava do mesmo jeito (apresentando o mesmo erro). Seria o Tamanho da imagem?

Vou anexar um print do erro: Print do erro

Já tentei box-sizing, mas não funcionou.. rsrs Alguém pode dar esse help?

CSS-Mobile - Da Seção em questão

    .rodapePrincipal-patrocinadores .container {
        flex-direction: column;
        align-items: center;
    }

    .rodapePrincipal-patrocinadores-list {
        margin: 0;
        width: 100%;
    }

    .rodapePrincipal-contatoForm {
        width: 100%;
    }

    .rodapePrincipal-contatoForm-fieldset {
        justify-content: center;
    }

CSS - Desktop - Da seção em questão

.rodapePrincipal-patrocinadores .container {
    display: flex;
    justify-content: space-between;
}

.rodapePrincipal-patrocinadores-list {
    display: flex;
    align-items: center;
    justify-content: space-around;
    width: 70%;
    margin-right: 5%;
}

.rodapePrincipal-contatoForm {
    width: 25%;
}

.rodapePrincipal-contatoForm-fieldset {
    display: flex;
}
1 resposta

Oi, Diogenes, tudo bem?

Você pode adicionar a propriedade flex-direction: column;, na classe .rodapePrincipal-patrocinadores-list dentro do estilos de breakpoint, ficando dessa forma:

.rodapePrincipal-patrocinadores-list {
        flex-direction: column;
        width: 100%;
    }

Deverá corrigir esse bug, pois, agora, os item ficarão em coluna evitando pegar espaços da largura.

Testa e me fala se deu certo!

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software