IE11 not recognizing HTML5 elements when loading a

I just started a new job and during my lunch brake I wanted to work on practicing some skills to prep for the MS 70-480 specialist exam. I prefer using Google Chrome, but the company has rules about installing software for personal use so I am stuck working on IE (version:11.0.9600.18015).

So in notepad++ I created the simple test for HTML5's video element.

<!DOCTYPE html>
<html>
<head>
  <title>70-480 Test Page</title>
</head>

<body>
<header>
  <h1>Practice makes perfect</h1>
</header>
  <section id="sandbox">
    <video width="400" controls="">
      <source src="http://www.w3schools.com/html/mov_bbb.mp4" >
      Your browser does not support the video element.
    </video>
  </section>
</body>
</html>

But the page came back without the video showing. I checked the Developer tools and found in the DOM Explorer elements native to the HTML5 (header, video, section, etc.) are not being recognized and instead are showing such as:

...
<body>
  <header></header>
    <h1>Practice makes perfect</h1>
  </header><//header>
  <section id="sandbox"></section>
    <video controls="" width="400"></video>
      <source src="http://www/w3schools.com/html/mov_bbb.mp4"></source>
    </video><//video>
  </section><//section>
</body>
....

I know IE11 supports the elements since when I copy my code to JSfiddle on that same browser it shows up fine. Is there an explanation for why Internet explorer is giving me this head ache?

Both Pedro Mendes and Lance Leonard's comments worked.

Pedro's solution: