title: Openlayers WMS layer comes up blank until I zoom in
body: <p>I'm trying to integrate Openlayers with ASP MVC3 using Geoserver as a learning process but came across this weird problem.  When I load the view, the map canvas comes up blank with the default zoom control. Only when I press the zoom-in button the map would display.  I originally thought it's something to do with ASP's Razor View so I copy it to a separate HTML file but the problem remains.  Any suggestions?</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
  &lt;script type="text/javascript" src="http://openlayers.org/api/OpenLayers.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript"&gt;
  
      function init() {
          var bounds = new OpenLayers.Bounds(
                      -124.848974, 45.543541,
                      -116.91558, 49.002494);
          var options = {
              maxExtent: bounds,
              maxResolution: 0.0309898203125,
              projection: "EPSG:4326",
              units: 'degrees'
          };
          var map = new OpenLayers.Map('map', options);
          var wms = new OpenLayers.Layer.WMS("Washington County Map", "http://localhost:8080/geoserver/tiger/wms",
              {
                  layers: 'tiger:county10',
                  format: 'image/png',
                  visibility: true,
                  isBaseLayer: true,
              });
  
          map.addLayer(wms);
          map.zoomToExtend(bounds);
      };
  &lt;/script&gt;
  &lt;/head&gt;
  &lt;body  onload="init()"&gt;
  &lt;h2&gt;Test&lt;/h2&gt;
  &lt;p&gt;
      To learn more about ASP.NET MVC visit &lt;a href="http://asp.net/mvc" title="ASP.NET MVC Website"&gt;http://asp.net/mvc&lt;/a&gt;.
  &lt;/p&gt;
  
  &lt;div id="map" style="width:800px; height:500px;" /&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>