CSS-段落之间的额外垂直间距（简单）

Question

I realize this is incredibly basic, but I setup a very simple HTML page in Firefox...

html {
  margin: 0; padding: 0;
  font-size: 62.5%;
}

p {
  text-align: justify;
  font-family: verdana, sans-serif;
  font-size: 1.6rem;
  width: 90%;
  margin: 0 auto; 
  padding: 1rem 0 1rem 0;
}

Easy enough.

However, say I have three paragraphs.

Above the the first paragraph, there's about 13px worth of space. There's also 13px worth of space underneath the last paragraph.

Underneath paragraphs 1 and 2 the space isn't collapsing. There's about 26px of space - having trouble remembering how to force padding/margins to collapse...

Thanks for any feedback.

Answer 1

Margins collapse when two vertical margins come in contact with each other with the greater margin overrides the other. Here is the modified code:

html {
  margin: 0; padding: 0;
  font-size: 62.5%;
}

p {
  text-align: justify;
  font-family: verdana, sans-serif;
  font-size: 1.6rem;
  width: 90%;
  margin: 1rem auto;
}