title: Controlling Morris Donut Chart dimesnions i.e. Height & width
body: <p>I'm using Morris chart to draw donut chart. 
  but I want to control its height. Donut chart always has fixed size. It doesn't respect the dimensions of div.when I reduce the height of div Donut chart overflows.</p>
  
  <pre><code>    &lt;html&gt;
        &lt;head&gt;
           #donutChart{
               height:200px;
           }
        &lt;/head&gt;
        &lt;body&gt;
          &lt;div id="donutChart"&gt;&lt;/div&gt;
        &lt;/body&gt;
      &lt;script&gt;
      var donutData = [{label:"A", count:100},
                   {label:"B", count:200},
                   {label:"C", count:300}
                  ]
      var color: [ "red", "green", "blue"]
      drawDonutChart( divId, donutData, colors ){
          var total = 0;
          for(var i = 0; i &lt; donutData.length ; i++){
              var item = donutData[i];
              total += item.value
          } 
          Morris.Donut({
              element: divId,
              data: donutData,
              colors: colors,
              formatter: function(x) {
                  return Math.round( (x*100)/total ) +"% ("+ x +")" ;
              }
          });
      }
     &lt;/script&gt;
     &lt;html&gt;
  </code></pre>