kexxcream kexxcream - 10 months ago 36
CSS Question

Same font size for h1 and h2 in article


Why do

tags have the same font size when being put inside an


enter image description here

Then I thought maybe it's simply my eyes who fool me so I measured it up.

enter image description here

I turned out to be the same size.

I looked at the following link ( I learned that it is based on hierarchy but
are on the same level of hierarchy.

should be 2em and
should be 1.5em.


<!DOCTYPE html>
<meta charset="utf-8">
<h1>This is h1.</h1>
<h2>This is h2.</h2>
<h3>This is h3.</h3>
<h4>This is h4.</h4>
<h5>This is h5.</h5>
<h6>This is h6.</h6>

Answer Source

Size of the headers are determined by browsers stylesheet (if not specified by user stylesheet). I tried in chrome. There in developer console I found that chrome is overriding the style for h1 to 1.5em for article, aside, nav and section

:-webkit-any(article,aside,nav,section) h1 {
  font-size: 1.5em;
  -webkit-margin-before: 0.83em;
  -webkit-margin-after: 0.83em;