diff --git a/styles.css b/styles.css
index 8ce760a9..83e9522f 100644
--- a/styles.css
+++ b/styles.css
@@ -85,6 +85,13 @@
     right: 0;
 }
 
+.format-grid .thegrid .grid-image .grid-badge-bottom {
+    bottom: 10px;
+    left: 0;
+    position: absolute;
+    right: 0;
+}
+
 .format-grid .thegrid .grid-generatedimage {
     background-size: contain;
     height: 140px;
diff --git a/templates/grid.mustache b/templates/grid.mustache
index 64419809..5d21120e 100644
--- a/templates/grid.mustache
+++ b/templates/grid.mustache
@@ -99,9 +99,9 @@
             {{/sectiontitleingridbox}}
             {{#imageuri}}
             <div class="grid-image card-img-bottom{{^sectiontitleingridbox}} card-img-top{{/sectiontitleingridbox}} text-center">
-                <img src="{{imageuri}}" alt="{{imagealttext}}" loading="lazy">
+                <img src="{{imageuri}}" alt="{{imagealttext}}" loading="lazy"{{^sectiontitleingridbox}} class="card-img-bottom card-img-top"{{/sectiontitleingridbox}}>
                 {{^sectiontitleingridbox}}{{#hasbadge}}
-                <div data-region="sectionbadges" class="sectionbadges d-flex justify-content-center align-items-center h-100 grid-badge-middle">
+                <div data-region="sectionbadges" class="sectionbadges d-flex justify-content-center align-items-end h-100 grid-badge-bottom">
                     {{$ core_courseformat/local/content/section/badges }}
                         {{> core_courseformat/local/content/section/badges }}
                     {{/ core_courseformat/local/content/section/badges }}