title: Highcharts: Remove space between plot border and actual chart
body: <p>We are migrating from a flash based charting library (FusionCharts) to a JavaScript based one (HighCharts).</p>
  
  <p>This is what our current flash charts look like
  <img src="https://i.stack.imgur.com/D09Xw.png" alt="Current flash charts"></p>
  
  <p>And this is what I've got so far with HighCharts.
  <img src="https://i.stack.imgur.com/tgSxS.png" alt="enter image description here"></p>
  
  <p>How can I remove the space (marked with big dumb red arrows) between the plot border and the actual chart data?</p>
  
  <p>Here's my code: <a href="http://jsfiddle.net/ChrisMBarr/7JAcN/1/" rel="noreferrer">http://jsfiddle.net/ChrisMBarr/7JAcN/1/</a></p>
  
  <pre><code>var chart = new Highcharts.Chart({
          chart:{
              renderTo: 'container',
              type: 'areaspline',
              plotBorderWidth: 1,
              spacingTop:2,
              spacingRight:5,
              spacingBottom:5,
              spacingLeft:2,
              borderWidth:1,
              borderRadius:0,
              borderColor:'#999'
          },
          credits: {
              enabled: false
          },
          title: {
              text: 'Total spam in the last 7 days'
          },
          legend: {
              verticalAlign: 'bottom',
              borderWidth: 1,
              backgroundColor: '#FFFFFF'
          },
          xAxis: {
              allowDecimals:false,
              categories: [
                  'Thu 2/14',
                  'Fri 2/15',
                  'Sat 2/16',
                  'Sun 2/17',
                  'Mon 2/18',
                  'Tue 2/19',
                  'Wed 2/20'
              ],
              labels: {
                  staggerLines: 2
              },
              tickmarkPlacement: 'on',
          },
          yAxis: {
              allowDecimals:false,
              alternateGridColor: '#F7F7F7',
              title: {
                  text: 'Number of Emails',
                  margin:5
              }
          },
          tooltip: {
              formatter: function() {
                  var isSpam = this.series.name === _chartOptions.series[1].name
                  return ''+this.x +': &lt;strong&gt;'+ this.y +(isSpam ? " Spam" : "") +' Emails&lt;/strong&gt;';
              }
          },
  
          plotOptions: {
              areaspline: {
                  fillOpacity: 0.5
              }
          },
  
          series:  [{
                  "name": "Total Mail",
                  "color":"#339999",
                  "data": [2,3,4,7,8,8,8]
              },{
                  "name": "Spam",
                  "color":"#003399",
                  "data": [2,2,4,4,4,6,8]
          }]
      });
  </code></pre>