title: Highstock Y-Axis labels overlap eachother
body: <p>Please take a look at this <a href="http://jsfiddle.net/nickeblewis/3jgQc/2/" rel="nofollow">fiddle</a> for the chart I am building.</p>
  
  <p>My issues are:</p>
  
  <ul>
  <li>Y-Axis labels and percentages overlap. Is it possible to align them so that I have green percentages, the label "Two", then red percentages and finally the label "Three"? If you take a look at another <a href="http://jsfiddle.net/nickeblewis/UxJU6/2/" rel="nofollow">fiddle</a> it certainly looks tidier.</li>
  <li>Highstock shows its labels inside the graph grid. Can these be pushed to the outside so that the labelling looks more like the way my second JSFiddle displays them?</li>
  </ul>
  
  <p>The first issue is most important for me to solve, and the second I could live with if I have to:</p>
  
  <pre><code>chart = new Highcharts.StockChart({
          chart: {
              renderTo: 'container',
              zoomType: 'xy'
          },
  
          rangeSelector: {
              selected: 4
          },
  
          yAxis: [{
               title: {
                  text: 'One',
                  style: {
                      color: 'blue'
                  }
              },
              labels: {
                  formatter: function() {
                      return (this.value &gt; 0 ? '+' : '') + this.value + '%';
                  }
              }
          },
          {
  
               title: {
                  text: 'Two',
                  style: {
                      color: 'green'
                  }
              },
              labels: {
                  formatter: function() {
                      return this.value + '%';
                  },
                  style: {
                      color: 'green'
                  }
              },
    opposite: true
          },
  {
  
               title: {
                  text: 'THree',
                  style: {
                      color: 'red'
                  }
              },
              labels: {
                  formatter: function() {
                      return this.value + '%';
                  },
                  style: {
                      color: 'red'
                  }
              },
    opposite: true
          }  
        ],
  
          plotOptions: {
              series: {
                  compare: 'percent'
              }
          },
  
          tooltip: {
              pointFormat: '&lt;span style="color:{series.color}"&gt;{series.name}&lt;/span&gt;: &lt;b&gt;{point.y}&lt;/b&gt; ({point.change}%)&lt;br/&gt;',
              valueDecimals: 2
          },
  
          series: seriesOptions
      });
  }
  
  });​
  </code></pre>