diff --git a/addons/website/static/src/scss/website.scss b/addons/website/static/src/scss/website.scss
index f78da24fa7b..b79a2d1e268 100644
--- a/addons/website/static/src/scss/website.scss
+++ b/addons/website/static/src/scss/website.scss
@@ -448,9 +448,13 @@ table.table_desc tr td {
 }
 
 .o_full_screen_height {
+    display: flex;
+    flex-direction: column;
+    justify-content: space-around;
     min-height: 100vh !important;
 }
 .o_half_screen_height {
+    @extend .o_full_screen_height;
     min-height: 55vh !important;
 }
 
diff --git a/addons/website/static/src/snippets/s_color_blocks_2/000.scss b/addons/website/static/src/snippets/s_color_blocks_2/000.scss
index efd84e4e6b0..8982f8e87b0 100644
--- a/addons/website/static/src/snippets/s_color_blocks_2/000.scss
+++ b/addons/website/static/src/snippets/s_color_blocks_2/000.scss
@@ -1,10 +1,16 @@
 .s_color_blocks_2 {
-    display: flex; // Needed to be able to stretch the inner container so that
-                   // the snippet works with the 50% and 100% height
+    // Needed to be able to stretch the inner container so that
+    // the snippet works with the 50% and 100% height
+    &.o_half_screen_height, &.o_full_screen_height {
+        > :first-child { // container
+            &, > .row {
+                min-height: inherit;
+            }
+        }
+    }
     .row {
         display: flex;
         flex-flow: row wrap;
-        height: 100%; // Needed for the 50% and 100% height option
 
         // Fix for safari browser as it 'supports' flex but not with the right
         // behavior