Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

IE11 not recognizing HTML5 elements when loading a page from my desktop, any ideas why?

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?

like image 595
Steven Biggs Avatar asked Jan 27 '26 08:01

Steven Biggs


1 Answers

Both Pedro Mendes and Lance Leonard's comments worked.

Pedro's solution:

Does your browser have the "Edge (default)" document mode set? Try this tag inside the header

Lance's solution:

Your page is likely being loaded in compatibility view. Please see this previous answer for more info.

I decided to go with Lance's solution so that if I make more pages in the future I won't have to include the meta tag every time.

like image 61
Steven Biggs Avatar answered Jan 28 '26 21:01

Steven Biggs



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!