title: How to style Highchart data table and make it responsive?
body: <p>I'm trying to export my highchart to a table below it. In their documentation about Highchart Table, I only found <a href="https://www.highcharts.com/docs/getting-started/frequently-asked-questions#add-data-table" rel="nofollow noreferrer">this</a> with this <a href="http://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/studies/exporting-table/" rel="nofollow noreferrer">example</a></p>
  
  <p>I'm trying to style the table with colored thead, but there's no thead tag in Highcharts' table. This doesn't work too</p>
  
  <pre><code> // draw category labels
  chart.xAxis[0].categories.forEach(function (name, i) {
      renderer.text(
          name,
          cellLeft + cellPadding,
          tableTop + (i + 2) * rowHeight - cellPadding
      )
      .css({
          fontWeight: 'bold',
          backgroundColor: '#aaa'
      })
      .add();
  });
  </code></pre>
  
  <p>Things I'm trying to do:<br>
   1. Color the thead<br>
   2. Append the average temperature below the chart<br>
   3. Erase the empty border stroke above the Month column<br>
   4. Make the table responsive  </p>
  
  <p>I can't seem to find any Highchart table documentation. Any help is welcomed. Thank you</p>