title: Horizontal scroll bars on programmatic dojox.grid.DataGrid
body: <p>How can I keep the horizontal scroll bar from displaying?</p>
  
  <p>An example of what I am attempting is at <a href="http://jsfiddle.net/fdlane/gjkGF/3/" rel="nofollow">http://jsfiddle.net/fdlane/gjkGF/3/</a></p>
  
  <p>Below is an example page of what I am attempting to do.  With the width of the container div set to greater than the grid width, I was expecting that the horizontal scroll bars would not be displayed.</p>
  
  <p>Using the current height of 200px and with the number of rows greater than 6, the vertical is displayed (good).  However, the horizontal is then also displayed (bad).</p>
  
  <p>What am I missing?</p>
  
  <p>Thanks</p>
  
  <p>fdl</p>
  
  <pre><code>&lt;!doctype html&gt;
  &lt;html&gt;
  &lt;head&gt;
  &lt;link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/dojo/1.6/dijit/themes/tundra/tundra.css" /&gt;
  &lt;link rel="stylesheet" type="text/css" title="Style" href="http://ajax.googleapis.com/ajax/libs/dojo/1.6.1/dojox/grid/resources/Grid.css"&gt;
  &lt;link rel="stylesheet" type="text/css" title="Style" href="http://ajax.googleapis.com/ajax/libs/dojo/1.6.1/dojox/grid/resources/tundraGrid.css"&gt;
  &lt;title&gt;Grid Scrolling&lt;/title&gt;
  &lt;/head&gt;
  &lt;body class="tundra"&gt;
  &lt;div id="container" style="width: 350px; height: 200px"&gt;
      &lt;div id="myGrid"&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;script src="https://ajax.googleapis.com/ajax/libs/dojo/1.6.1/dojo/dojo.xd.js"&gt;    &lt;/script&gt;
  &lt;script&gt;
      dojo.require("dojo.store.Memory");
      dojo.require("dojo.data.ObjectStore");
      dojo.require("dojox.grid.DataGrid");
  
      dojo.ready(function () {
  
          var myStore = new dojo.store.Memory({
              data: [{ id: "RecId1", values: "fooValue1" },
              { id: "RecId2", values: "fooValue2" },
              { id: "RecId3", values: "fooValue3" },
              { id: "RecId4", values: "fooValue4" },
              { id: "RecId5", values: "fooValue5" },
              { id: "RecId6", values: "fooValue6" },
              { id: "RecId7", values: "fooValue7" },
              { id: "RecId7", values: "fooValue7"}]
          });
  
          dataStore = new dojo.data.ObjectStore({
              objectStore: myStore
          });
  
          var grid = new dojox.grid.DataGrid({
  
              store: dataStore,
              structure: [{
                  name: "ID",
                  field: "id",
                  width: "100px"
              }, {
                  name: "Values",
                  field: "values",
                  width: "100px"
              }]
          }, "myGrid");
  
          grid.startup();
      });
  &lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>