diff --git a/client/styles/components/_console.scss b/client/styles/components/_console.scss
index e1fd9658..d96dfd4c 100644
--- a/client/styles/components/_console.scss
+++ b/client/styles/components/_console.scss
@@ -4,6 +4,8 @@
 	background: $console-light-background-color;
 	z-index: 1000;
 	overflow: hidden;
+	display: flex;
+	flex-direction: column;
 
 	& > {
 		position:relative;
@@ -13,14 +15,17 @@
 	// assign styles to different types of console messages
 	.preview-console__log {
 		color: $dark-secondary-text-color;
+		flex: 1 0 auto;
 	}
 
 	.preview-console__error {
 		color: $console-error-color;
+		flex: 1 0 auto;
 	}
 
 	.preview-console__warn {
 		color: $console-warn-color;
+		flex: 1 0 auto;
 	}
 }
 
@@ -41,7 +46,7 @@
 	display: flex;
 	flex-direction: column;
 	overflow-y: auto;
-	height: #{121 / $base-font-size}rem;
+	flex: 1 0 0%;
 
 }