CSS. Browser rendering of h1 in nested section becomes smaller (2016-11-16)

By Xah Lee. Date: .

css. browser rendering of h1 in nested section becomes smaller

browser rendering of h1 in nested section

html h1 tag inside nested section gets increasingly small, by browser css. but not h2, h3 etc.

example

nested section h1
nested section h1
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <style>section {border:solid thin blue; margin:1ex}</style>
    <title>test nested section h1</title>
  </head>
  <body>
    <section>
      <h1>xyz 1</h1>
      <section>
        <h1>xyz 2</h1>
        <section>
          <h1>xyz 3</h1>
          <section>
            <h1>xyz 4</h1>
            <section>
              <h1>xyz 5</h1>
              <section>
                <h1>xyz 6</h1>
                <section>
                  <h1>xyz 7</h1>
                </section>
              </section>
            </section>
          </section>
        </section>
      </section>
    </section>
  </body>
</html>

test