3
respostas

Espaçamento entre os itens da lista

Antes do professor inserir o código:

margin: 0 1.5%;

Os itens da lista já tinham um pequeno espaçamento entre eles. Estou tentando entender de onde veio esse espaçamento, já que o html já tinha aplicado o reset.css.

Obrigado!

3 respostas

Felipe o reset.css é um arquivo utilizado para zerar vários espaçamentos entre os elementos, mas conforme você vai desenvolvendo suas páginas tem que ir melhrando a aparência de cada um deles, neste caso os itens estavão muitos próximos uns dos outros, sendo utilizada uma margem esquerda (margin: 0 1.5%;) que sobrescreveu a margem dada anteriormente no elementos dos itens

  • . Espero ter te ajudado.

Oí, Hideraldorondon, tudo bem?

Primeiramente, obrigado pela explicação!

Eu entendi o que você disse, os elementos estavam muito juntos dos lados e o professor colocou 1.5% pra deixá-los mais separados, porém antes do professor incluir esse comando, na aula mostra que já havia um espaçamento entre as tags

<li>

. Estou na dúvida de onde veio esse espaçamento que estava antes de incluir esse comando que eu citei, pois o arquivo reset.css, no meu entendimento, deveria ter zerado os espaços, deixando todos os

<li>

juntinhos...

Obs: Da pra ver esse espaço no vídeo no momento 00:29, quando o professor coloca a cor cinza pra mostrar como os blocos estão no layout

Felipe

Felipe, vou ver se posso tirar sua duvida, quando você coloca uma tag

  • , por padrão ela já vem com algumas configurações, sobrepondo as configurações do reset.css. Faça o seguinte, entre na sua pagina de produtos, F12 para ver o console em elements localize a tag ul da class=produtos, clique nela e em styles role a barra até encontrar o que a tag ul tem por padrão, onde você encontrar "margin-block-start: 1em;" e "margin-block-end: 1em;", acredito que esteja ai a margem que você diz ver no video. Tu também gosta de coisa dificil em? Mas é assim que se aprende. Espero ter te ajudado.