diff --git a/app/assets/stylesheets/pages/repo.scss b/app/assets/stylesheets/pages/repo.scss
index efc478617688fb6d5520a2d04c63bcfe600af11e..69abb13add4a2eb70a91b32dcde21456f8069217 100644
--- a/app/assets/stylesheets/pages/repo.scss
+++ b/app/assets/stylesheets/pages/repo.scss
@@ -43,8 +43,10 @@
   display: inline-block;
 }
 
-.blob-viewer[data-type="rich"] {
-  margin: 20px;
+@media (min-width: $screen-md-min) {
+  .blob-viewer[data-type="rich"] {
+    margin: 20px;
+  }
 }
 
 .repository-view {
diff --git a/changelogs/unreleased/37368-blob-viewer-on-mobile.yml b/changelogs/unreleased/37368-blob-viewer-on-mobile.yml
new file mode 100644
index 0000000000000000000000000000000000000000..6a955f5715f9105da214d29e7a51826da6726234
--- /dev/null
+++ b/changelogs/unreleased/37368-blob-viewer-on-mobile.yml
@@ -0,0 +1,5 @@
+---
+title: Make blob viewer for rich contents wider for mobile
+merge_request: 14011
+author: Takuya Noguchi
+type: fixed