diff --git a/editor/components/block-list/style.scss b/editor/components/block-list/style.scss
index 3e78f3daf3535e..45852bc4c218f5 100644
--- a/editor/components/block-list/style.scss
+++ b/editor/components/block-list/style.scss
@@ -44,6 +44,8 @@
 	&.has-warning .editor-block-list__block-edit {
 		position: relative;
 		min-height: 250px;
+		max-height: 500px;
+		overflow: hidden;
 
 		> :not( .editor-warning ) {
 			pointer-events: none;
@@ -59,6 +61,7 @@
 		bottom: 0;
 		left: 0;
 		background-color: rgba( $white, 0.6 );
+		background-image: linear-gradient( to bottom, transparent, #fff );
 	}
 
 	// simpler style for a block that has cursor focus (but hasn't been selected)
diff --git a/editor/components/warning/style.scss b/editor/components/warning/style.scss
index 909c855f6aef1e..f1e3d10266c08e 100644
--- a/editor/components/warning/style.scss
+++ b/editor/components/warning/style.scss
@@ -1,9 +1,9 @@
 .editor-warning {
 	z-index: z-index( '.editor-warning' );
 	position: absolute;
-	top: 50%;
+	top: 15px;
 	left: 50%;
-	transform: translate( -50%, -50% );
+	transform: translateX( -50% );
 	display: flex;
 	flex-direction: column;
 	justify-content: space-around;