Odd spacing at the top of html5 boilerplate demo

Question

I downloaded the HTML5 Boilerplate template from here http://html5boilerplate.com.

When I opened it to preview the template; I see an odd space on the top. It can be seen on their online demo also: http://demo.html5boilerplate.com/

I see this on the following:

• FireFox v28
• Chrome v34.0.1847.116
• Internet Explorer v11

---

CSS In Use:

• http://demo.html5boilerplate.com/css/normalize.css
• http://demo.html5boilerplate.com/css/main.css

---

I had a look at the page's html source and the css stylesheets. I can't figure out where this odd spacing on top of <p> tag is coming from.

Answer 1

It's default user agent style

p {
display: block;
-webkit-margin-before: 1em;
-webkit-margin-after: 1em;
-webkit-margin-start: 0px;
-webkit-margin-end: 0px;
}

You need to define your own style for <p> element. Is that what you mean?

Answer 2

From what I can see there is a 16px margin to the top and bottom of the <p> tag.