diff --git a/packages/backend/src/Chain.ts b/packages/backend/src/Chain.ts
index c764313..2eed69e 100644
--- a/packages/backend/src/Chain.ts
+++ b/packages/backend/src/Chain.ts
@@ -16,7 +16,8 @@ export default class Chain {
   public height = 0 as Types.BlockNumber;
   public blockTimestamp = 0 as Types.Timestamp;
 
-  private blockTimes: Array<number> = new Array(BLOCK_TIME_HISTORY);
+  private blockTimes: Array<number> = new Array(BLOCK_TIME_HISTORY).fill(0);
+  private averageBlockTime: Maybe<Types.Milliseconds> = null;
 
   constructor(label: Types.ChainLabel) {
     this.label = label;
@@ -82,7 +83,7 @@ export default class Chain {
       const { height, blockTimestamp } = node;
 
       if (this.blockTimestamp) {
-        this.blockTimes[height % BLOCK_TIME_HISTORY] = blockTimestamp - this.blockTimestamp;
+        this.updateAverageBlockTime(height, blockTimestamp);
       }
 
       this.height = height;
@@ -101,21 +102,20 @@ export default class Chain {
     console.log(`[${this.label}] ${node.name} imported ${node.height}, block time: ${node.blockTime / 1000}s, average: ${node.average / 1000}s | latency ${node.latency}`);
   }
 
-  private get averageBlockTime(): Maybe<Types.Milliseconds> {
+  private updateAverageBlockTime(height: Types.BlockNumber, now: Types.Timestamp) {
+    this.blockTimes[height % BLOCK_TIME_HISTORY] = now - this.blockTimestamp;
+
     let sum = 0;
     let count = 0;
 
     for (const time of this.blockTimes) {
-      if (time != null) {
+      if (time) {
         sum += time;
         count += 1;
       }
     }
 
-    if (count === 0) {
-      return null;
-    }
-
-    return (sum / count) as Types.Milliseconds;
+    // We are guaranteed that count > 0
+    this.averageBlockTime = (sum / count) as Types.Milliseconds;
   }
 }
diff --git a/packages/frontend/src/components/Chain.css b/packages/frontend/src/components/Chain.css
index e9ef150..e9a564b 100644
--- a/packages/frontend/src/components/Chain.css
+++ b/packages/frontend/src/components/Chain.css
@@ -6,13 +6,17 @@
   color: #000;
 }
 
-.Chain-content {
+.Chain-content-container {
   position: absolute;
   left: 0; /*80px;*/
   right: 0;
   bottom: 0;
   top: 148px;
-  min-height: 50vh;
+}
+
+.Chain-content {
+  width: 100%;
+  min-height: 100%;
   background: #222;
   color: #fff;
   box-shadow: rgba(0,0,0,0.5) 0 3px 30px;
diff --git a/packages/frontend/src/components/Chain.tsx b/packages/frontend/src/components/Chain.tsx
index 9158ee4..20ef9c3 100644
--- a/packages/frontend/src/components/Chain.tsx
+++ b/packages/frontend/src/components/Chain.tsx
@@ -46,27 +46,29 @@ export function Chain(props: Chain.Props) {
         <Tile icon={blockTimeIcon} title="Avgerage Time">{ blockAverage == null ? '-' : (blockAverage / 1000).toFixed(3) + 's' }</Tile>
         <Tile icon={lastTimeIcon} title="Last Block"><Ago when={blockTimestamp} /></Tile>
       </div>
-      <div className="Chain-content">
-        <table className="Chain-node-list">
-          <thead>
-            <tr>
-              <th><Icon src={nodeIcon} alt="Node" /></th>
-              <th><Icon src={nodeTypeIcon} alt="Implementation" /></th>
-              <th><Icon src={peersIcon} alt="Peer Count" /></th>
-              <th><Icon src={transactionsIcon} alt="Transactions in Queue" /></th>
-              <th><Icon src={blockIcon} alt="Block" /></th>
-              <th><Icon src={blockHashIcon} alt="Block Hash" /></th>
-              <th><Icon src={blockTimeIcon} alt="Block Time" /></th>
-              <th><Icon src={propagationTimeIcon} alt="Block Propagation Time" /></th>
-              <th><Icon src={lastTimeIcon} alt="Last Block Time" /></th>
-            </tr>
-          </thead>
-          <tbody>
-          {
-            nodes.map((node) => <Node key={node.id} {...node} />)
-          }
-          </tbody>
-        </table>
+      <div className="Chain-content-container">
+        <div className="Chain-content">
+          <table className="Chain-node-list">
+            <thead>
+              <tr>
+                <th><Icon src={nodeIcon} alt="Node" /></th>
+                <th><Icon src={nodeTypeIcon} alt="Implementation" /></th>
+                <th><Icon src={peersIcon} alt="Peer Count" /></th>
+                <th><Icon src={transactionsIcon} alt="Transactions in Queue" /></th>
+                <th><Icon src={blockIcon} alt="Block" /></th>
+                <th><Icon src={blockHashIcon} alt="Block Hash" /></th>
+                <th><Icon src={blockTimeIcon} alt="Block Time" /></th>
+                <th><Icon src={propagationTimeIcon} alt="Block Propagation Time" /></th>
+                <th><Icon src={lastTimeIcon} alt="Last Block Time" /></th>
+              </tr>
+            </thead>
+            <tbody>
+            {
+              nodes.map((node) => <Node key={node.id} {...node} />)
+            }
+            </tbody>
+          </table>
+        </div>
       </div>
     </div>
   );