Solucionado
Entendi perfeitamente o porque colocar o
nav ul li {
margin-right:50px;
}Quando quero dar um espaçamento entre os menus quando uso o
display: inlinemas e se eu quiser que a distância entre os elementos seja calculada de forma automática dependendo da quantidade de menus que tenho?
Olá Helder,
Acredito que uma solução seria o flexbox do CSS3; se você não ouviu falar, certamente ouvirá em breve!
No caso apresentado, a solução seria:
ul {
display: flex; /* Define o comportamento flexbox no elemento Pai*/
flex-direction: row; /* Define o modo como o flex controlará o espaço entre os elementos filhos */
width: 100%; /* Determina que o elemento ocupe todo o espaço disponível */
}
ul li {
flex: 1; /* Define que o elemento filho tenha a proporção de tamanho 1:1, ou seja, igual para todos os elementos filhos, não importando a quantidade de elementos filhos tenha, o espaço sempre será o mesmo entre eles*/
text-align: center; /* Apenas alinha o texto do elemento */
}Você pode testar melhor essas propriedades nesse link: https://jsfiddle.net/sebmagneto/9netdccp/