Solucionado (ver solução)
Solucionado
(ver solução)
6
respostas

Cabeçalho

Bom dia pessoal. Tudo bem ?

Alguem pode me ajudar, estou fazendo o curso de Layouts Responsivos: trabalhando com layouts mobile porém, o meu cabeçalho fica desta forma. Ja rodei todo o codigo, revi os videos e não achei o erro.

Insira aqui a descrição dessa imagem para ajudar na acessibilidade

6 respostas

Oi Guilherme, tudo bem?

Poderia mandar aqui pra gente o seu código? Assim fica melhor pra gente visualizar o que pode estar errado. Você pode usar essa ferramenta aqui:

print ferramenta bloco de código

Fico no aguardo! Obrigada :D

Oi Lorena, segue abaixo o meu código do cabeçalho. Se precisar de outra parte, me avise pf.

.cabecalho {
    color: var(--branco);

    width: 100%;

    box-sizing: border-box;

    display: flex;
    flex-direction: column;
    align-items: center;

    padding-top: .75rem;
    padding-bottom: .75rem;

    border-bottom: 1px solid var(--borda-cabecalho-mobile);

    position: absolute;
}

.cabecalho__logo {
    margin-bottom: 1rem;
}

.cabecalho__navegacao {
    text-align: center;
}

.cabecalho__link {
    font-size: 1.1rem;

    display: inline-block;

    margin-right: .7rem;
    margin-bottom: 1.25rem;
    margin-left: .7rem;
}

Oi Guilherme, tudo bem?

Preciso do HTML também, se você tiver ele no GitHub pode mandar :D

Bons estudos!

Oi Lorena, veja se vc consegue visualizar.

https://github.com/Guuibs/Apeperia

Desculpe a demora, nunca usei o github e tava apanhando um pouco.

Boa noite Guilherme. Pelo que vi, voce não criou as variáveis css para as cores, por isso sua fonte não mudou para branco!

solução!

Oi Guilherme, tudo bem?

Como o Allan falou, não vi no seu código as variáveisCSS para cores. Na base está faltando basicamente, essa parte:

:root {
    --branco: #FFF;
    --azul-claro: #DFE3E5;
    --vermelho-forte: #B72E2E;
    --cinza-escuro: #4F4C4C;
    --cinza-claro: #F7F4F4;
    --cinza-medio: #D9D9D9;

    --fonte-link: #0084FF;
    --fonte-cinza: #666;
    --borda-cabecalho-mobile: #103D4A;
    --bg-rodape: #333;
    --bg-chamada-mobile: #00161C;

    --planos-cartao-start: #56CCF2;
    --planos-cartao-ultra: #B04CD9;
    --planos-cartao-mega: #E33B3B;

    --montserrat: 'Montserrat', sans-serif;
}

Ao ver seu código percebemos que CSS da Base já começa com o body.