diff --git a/blocks/myoverview/templates/courses-view-course-item.mustache b/blocks/myoverview/templates/courses-view-course-item.mustache
index c36b8e799bfd6..5e2b5ab606a0b 100644
--- a/blocks/myoverview/templates/courses-view-course-item.mustache
+++ b/blocks/myoverview/templates/courses-view-course-item.mustache
@@ -29,7 +29,7 @@
     }
 }}
 <div class="col-lg-6 col-xl-4">
-    <div class="card m-b-1">
+    <div class="card m-b-1 courses-view-course-item">
         <div class="card-block course-info-container" id="course-info-container-{{id}}">
             <div class="hidden-sm-up hidden-phone">
                 {{> block_myoverview/progress-chart}}
diff --git a/theme/boost/scss/moodle/blocks.scss b/theme/boost/scss/moodle/blocks.scss
index c988f38c2516c..217235208b9a3 100644
--- a/theme/boost/scss/moodle/blocks.scss
+++ b/theme/boost/scss/moodle/blocks.scss
@@ -187,4 +187,9 @@ $doughnut-fill-colour: $brand-warning;
         height: 125px;
         width: 145px;
     }
+
+    .courses-view-course-item {
+        height: 220px;
+        overflow-y: hidden;
+    }
 }
diff --git a/theme/bootstrapbase/less/moodle/blocks.less b/theme/bootstrapbase/less/moodle/blocks.less
index 9ecf8f4115aea..7c4b9777b9ca2 100644
--- a/theme/bootstrapbase/less/moodle/blocks.less
+++ b/theme/bootstrapbase/less/moodle/blocks.less
@@ -362,4 +362,9 @@
         height: 125px;
         width: 145px;
     }
+
+    .courses-view-course-item {
+        height: 220px;
+        overflow-y: hidden;
+    }
 }
diff --git a/theme/bootstrapbase/style/moodle.css b/theme/bootstrapbase/style/moodle.css
index 66189fbb28c51..c1812be91bf76 100644
--- a/theme/bootstrapbase/style/moodle.css
+++ b/theme/bootstrapbase/style/moodle.css
@@ -16344,6 +16344,10 @@ body {
   height: 125px;
   width: 145px;
 }
+.block_myoverview .courses-view-course-item {
+  height: 220px;
+  overflow-y: hidden;
+}
 /**
  * Moodle forms HTML isn't changeable via renderers (yet?) so this
  * .less file imports styles from the bootstrap @variables file and