title: Highcharts Tooltip cropping
body: <p>I am using high charts but am experiencing an issue with larger tooltip cropping off at the outer elements of the SVG, as per the image below.</p>
  
  <p><img src="https://i.stack.imgur.com/yKszO.jpg" alt="enter image description here"></p>
  
  <p>The option <code>useHTML</code> is set to true for the tooltip and xAxis, as I am applying some custom CSS these elements.</p>
  
  <p>Is there a way to have the tooltip not to crop?</p>
  
  <p>My highcharts code looks like this:</p>
  
  <pre><code>        return {
          chart: {
              renderTo: this._chartContainer,
              type: 'columnrange',
              inverted: true
          },
          title: {
              text: this._getTitle(values)
          },
          xAxis: {
              categories: values.rows.labels[0],
              labels: {
                  formatter: function() {
                      return '&lt;span class="xAxisTruncate" title="' + this.value + '"&gt;'+ this.value +'&lt;/span&gt;';
                  },
                  useHTML: true
              }
          },
          yAxis: {
              max: this._getMax(),
              min: this._getMin(),
              gridLineWidth: 2,
              opposite: true,
              tickInterval: 31 * 24 * 3600 * 1000,
              type: 'datetime',
              dateTimeLabelFormats: {
                  month: '%b %y'
              },
              title: {
                  text: yAxisTitleText
              },
              endOnTick: false,
              labels: {
                  align: 'left'
              }
          },
          plotOptions: {
              series: {
                  borderWidth: 0,
                  borderColor: 'transparent',
                  borderRadius: 5,
                  groupPadding: 0.05
              },
              columnrange: {
                  dataLabels: {
                      enabled: true
                  },
                  animation: false,
                  colorByPoint: false
              }
          },
          legend: {
              enabled: false
          },
          series: columnRangeSeries,
          tooltip: {
              enabled: true,
              useHTML: true,
              formatter: function(){
                  return this.point.toolTip;
              }
          }
      };
  </code></pre>
  
  <p>Thanks in advance.</p>