No teste realizado aqui dentro só do nav{} não deu certo, por esse motivo coloquei dentro de nav ul{} quero saber o porque aconteceu isso?
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
No teste realizado aqui dentro só do nav{} não deu certo, por esse motivo coloquei dentro de nav ul{} quero saber o porque aconteceu isso?
Oi Arthur, tudo certo?
Coloca o seu código HTML e CSS para darmos uma olhada?
Tanto o nav quanto a ul sao BLOCK, entao eles deveriam pegar a largura setada da mesma forma.
Abcs!
HTML
`<!DOCTYPE html>
Melhor coisa do mundo
| Nutrientes | Porção (60g) | %VD |
|---|---|---|
| Valor Calórico(Kcal) | 225,37 | 9,01 |
| Carboidratos(g) | 40,56 | 10,82 |
| Proteínas(g) | 5,97 | 8,53 |
| Gorduras Totais(g) | 4,36 | 5,45 |
| Gorduras Saturadas(g) | 2,71 | 10,83 |
| Colesterol(mg) | 16,68 | 5,56 |
| Fibras Alimentares(g) | 0,30 | 0,99 |
| Cálcio(mg) | 142,21 | 17,78 |
| Ferro(mg) | 0,26 | 1,89 |
| Sódio(mg) | 91,69 | 3,82 |
`
´´´css´´´
ul{ width: 570px; margin-left: auto; margin-right: auto; }
nav{ float:left; }
nav ul{ list-style: none; padding-left: 0; width:200px; }
nav ul li{ background-color: #ff5f00; margin-bottom: 3px; }
nav ul li:hover{ background-color: #cd4c00; }
nav ul li a{ text-decoration: none; color: black; }
top:0; right:0; position: fixed; }
width:740px; float:right; }
body{ background-color: #F5F0DC; font-family: Helvetica, Arial, sans-serif; width: 940px; margin: auto; }
h2{ Background:-webkit-linear-gradient(top, #ff6900, #ffa261 30%); border-radius: 15px; border: 1px solid black; padding: 5px; color: #FFFFFF; }
figure{ background-color: white; width: 300px; text-align: center; padding: 15px; font-family: 'Comic Sans MS',cursive; border: 3.4px solid black; box-shadow: 5px 5px 3px rgba(0,0,0,0.7); -moz-transform:rotate(-5deg); -webkit-transform:rotate(-5deg); }
/figure:hover{ -webkit-transform:rotate(0deg); -moz-transform:rotate(0deg); }/
text-align: center; color: #FF0099; }
border: 1px solid black; width: 40%; margin: auto; }
background-color: #e5d100; }
background-color: #FFFFFF; }
background-color: #F8EAB3; }
.val-nutri{ text-align: center; }
a{ color:blue; text-decoration:none; }
a:hover{ text-decoration:underline; }
Oi Arthur,
Tentei ir pegando seu codigo, achei o ponto aqui.
Como foi colocada uma largura na UL, ela está "mandando mais" que ali na regra da NAV proposta pelo exercicio.
Voce pode tirar essa largura da UL que a largura da NAV será respeitada. Esse é um dos problemas de selecionar por elementos HTML (figure, p, h1, etc) e não usar classes e IDs, mas voce vai pegando essa ideia conforme vai evoluindo nos cursos, ok?
Espero ter ajudado,
Abcs!
No exercicio em si solicita colocar a larguta dentro do nav
nav{ width: 200px; }
Porém desse modo não funciona, com isso coloquei dentro da UL.
nav ul { width: 200px; }
Só não entendi o erro no meu codigo :( mas td bem funcionou rsrs.
Oi Arthur,
Perfeito, se funcionou otimo.
O ponto que comentei foi a largura que estava na UL, se voce tira a regra pedida no exercicio funciona.
Talvez seja algo que deveria ter sido tirado lááá atrás nas aulas, só fazendo o curso pra saber ou pegando o projeto final.
Abcs e bons estudos!