update

src/components/Chart.vue

@@ -1,9 +1,8 @@
 <template>
   <div class="chart-container">
-    <div class="loader-container" v-if="loading">
-      <Loader></Loader>
-    </div>
+    <Loader v-if="loading"></Loader>
     <div class="chart" v-else>
+      <!-- Wrapper for chart so that highchart doesn't create scrollbars -->
       <div ref="chart"></div>
     </div>
   </div>
@@ -108,20 +107,22 @@ export default {
 
 <style lang="scss">
 @import "@/style/_variables.scss";
-.chart-container, .chart, .chart div {
-  // height: 100%;
+.chart {
   display: flex;
   flex-direction: column;
   flex-grow: 1;
+  width: 100%;
+}
+.chart div {
+  height: 100%;
 }
 .chart-container {
-  margin-bottom: 24px;
-}
-.loader-container {
   display: flex;
+  flex-direction: column;
+  flex-grow: 1;
   align-items: center;
   justify-content: center;
-  height: 100%;
+  margin-bottom: 24px;
 }
 .highcharts-graph {
   stroke-width: 3px;

src/style/style.scss

@@ -2,6 +2,7 @@
 @import url('https://fonts.googleapis.com/css?family=Fira+Sans&display=swap');
 html, body {
     height: 100%;
+    overflow: hidden; /* Highcharts can cause scrollbars because it rounds pixels */
 }
 @import "./variables";
 @import "~bulma/bulma";