diff --git a/index.html b/index.html
index baca314..4c923ab 100644
--- a/index.html
+++ b/index.html
@@ -2,10 +2,7 @@
 <html lang="en">
     <head>
         <meta charset="UTF-8">
-        <meta
-            name="viewport"
-            content="width=device-width, initial-scale=1.0"
-        >
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
         <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
         <title>Karlkoder Playground</title>
@@ -63,10 +60,10 @@
                 <section>
                     <div class="section-header">Output</div>
 
-                    <canvas id="canvas-area"> </canvas>
+                    <canvas id="canvas-area" width="480" height="360"></canvas>
                 </section>
 
-                <section>
+                <section id="console-section">
                     <div class="section-header">
                         Console
                     </div>
diff --git a/style.css b/style.css
index c83ae0b..5002b36 100644
--- a/style.css
+++ b/style.css
@@ -35,7 +35,6 @@ section {
     display: flex;
     flex-direction: column;
     background-color: black;
-    overflow-y: auto;
 }
 
 section canvas {
@@ -81,13 +80,17 @@ div#buttons > * > button {
 
 #canvas-area {
     background-color: black;
-    width: 480px;
-    height: 360px;
+}
+
+#console-section {
+    min-height: 0;
+    flex: 0 1 100%;
 }
 
 #console {
     display: flex;
     flex-direction: column;
+    overflow-y: scroll;
 }
 
 #console pre {
@@ -122,6 +125,7 @@ div#buttons > * > button {
 
 #editor-area {
     width: 100%;
+    overflow-y: auto;
 }
 
 #editor {
