Site adaptável | HTML e CSS: Classes, posicionamento e Flexbox

2
respostas

por Evandro Maciel Trindade Ferreira

| 26.7k xp | 2 posts

Fiscal Tributário

E aí, galera. Estou dando meus primeiros passos em HTML e CSS.
Estou com algumas dificuldades. A primeira delas é deixar o site de forma com que se enquadre legal na tela (ficou uma barra do plano de fundo embaixo que não consegui eliminar).
A outra é deixar com o que o site fique adaptável para telas de tamanhos diferentes, tela de celular, principalmente, já que eu pretendo de fato enviar o link desse convite para as pessoas. A imagem vai para trás do texto, os outros itens também não se adaptam direito. Fica uma bagunça kkkk

Segue o link do git para vocês verificarem e me ajudarem com o projeto. Valeu.

https://github.com/evandro-maciel/convite-aniversario.git

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

2 respostas

por Victor Costa Santos

| 2433.3k xp | 4913 posts

Alura Scuba Team

3 dias atrás

Olá Evandro!

Muito bem, indo direto às suas dúvidas:

Para fixar o rodapé no final da tela, você pode usar position: fixed.

Aplique esta 4 linhas ao final do seu footer ao final da classe rodape:

    .rodape {
    font-family: var(--fonte-primaria);
    background-color: var(--cor-secundaria);
    color: var(--cor-terciaria);
    text-align: center;
    padding: 10px;
    padding-left: 15%;
    position: fixed; 
    bottom: 0;
    left: 0;
    width: 100%;
}

O tema de responsividade é o foco dos próximos cursos da formação, que ensinam as técnicas para adaptar seu site para celulares e outras telas.

Recomendo que você continue com os seguintes cursos para aprender exatamente isso:

Espero ter ajudado! Bons estudos!

Sucesso ✨

por Evandro Maciel Trindade Ferreira

| 26.7k xp | 2 posts

Fiscal Tributário

2 dias atrás

Valeu, Victor. Realmente resolveu o problema do meu rodapé!

Vou dar uma analisada mais nos cursos pra poder deixar ele mais adaptável.

Show demais.