At a loss with responsive grid that works in JSFiddle, and not locally

At a loss with responsive grid that works in JSFiddle, and not locally

Hello,

I am ready to pull my hair out on this one :)

This fiddle works just plain-old-awesome in IE 9, Firefox, and Chrome:

http://jsfiddle.net/JXY6E/1/

And, below is basically, to the best I can tell, the same exact markup, but in Internet Explorer 9 it always loads with the blocks stacked on top of each other. I am at a total loss why this is happening.

What's worse is that the example pages on the documentation site also work great in IE 9 for me, these ones: http://view.jquerymobile.com/1.3.0/#/1.3.0/docs/widgets/grids/

<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>VersionOne App Catalog</title>
  <script src="http://code.jquery.com/jquery-1.8.3.min.js" type="text/javascript"></script>
  <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.css" />
  <script src="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js"
    type="text/javascript"></script>
</head> 
<body>
  <div data-role="page">
    <div data-role="header">
      <h1>IE Can Haz Good Responsiveness?</h1>   
    </div>
    <div data-role="content">
      <h3>Grid A (50/50)</h3>
      <div class="ui-grid-a ui-responsive">
        <div class="ui-block-a">
            <div class="ui-body ui-body-d">Block A</div>
        </div>
        <div class="ui-block-b">
            <div class="ui-body ui-body-d">Block B</div>
       </div>
      </div>
    </div>
  </div>
</body>
</html>