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

09_conclusao_html_02

Referente ao curso HTML5 e CSS3 parte 2: posicionamento, listas e navegação

por Felipe Perlin
| 29.3k xp | 12 posts
Tier1

No desafio da ultima aula de conclusao o Pedro pede para incluir o cabecalho e o rodape na pagina index. Ao incluir eu percebi que meu cabecalho nao ficava inline de jeito nenhum ate q fiz essa mudanca no codigo. Tenho a primeira lista com display: inline; dentro do

e pela minha logica a lista abaixo altera o para display: inline-block; ja q ela aparece por ultimo alterando todo o codigo acima. Foi isso q entendi estar acontecendo.

ul li .itens{ parte alterada (antes da adicao do cabecalho ul{... )

display: inline-block;

vertical-align: top;

width: 20%;

margin-right: 15%;

} Essa alteracao q fiz esta correta? (desculpem a falta de acento, meu teclado n permite essa funcao)

2 respostas
solução!
por Anderson Gabriel Almeida Pereira
| 175.1k xp | 24 posts
ABAP

Eaii Felipe, beleza?

Não tá errado, mas tem uma forma mais simples de fazer o que você quer. Em vez de alterar a propriedade display dos elementos li, você pode usar a propriedade flex-grow para distribuir o espaço disponível entre os elementos da lista de forma igual.

por exemplo: 

ul {
  display: flex; /* Transforma a lista em um container flexível */
  justify-content: space-between; /* Alinha os itens da lista à direita e esquerda */
}

ul li {
  flex-grow: 1; /* Distribui o espaço disponível de forma igual entre os elementos */
}

Desse jeito, os elementos da lista serão distribuídos de forma igual e ocuparão todo o espaço disponível na largura da tela. Isso elimina a necessidade de usar a propriedade display: inline-block e ajustar as margens manualmente.

Espero que isso ajude! Bons estudos.

por Felipe Perlin
| 29.3k xp | 12 posts
Tier1

Obrigado por responder Mr. Anderson. Eu ainda nao cheguei a estudar esse tipo de alteracao, estou apenas no 4* dia de estudos mas ja vou fazer uma anotacao sobre o q vc me ensinou. :)

Agora n sei se e uma boa pratica agradecer com comentario.