diff --git a/src/css/surah.scss b/src/css/surah.scss
index edede50d9..03a128cba 100644
--- a/src/css/surah.scss
+++ b/src/css/surah.scss
@@ -8,6 +8,10 @@ body {
   margin: 0 auto;
   width: 450px;
 
+  @media screen and (max-width: 450px) {
+    width: 350px;
+  }
+
   .flex-row {
     display: flex;
     flex-direction: row;
diff --git a/src/surah.html b/src/surah.html
index ff155b1f5..d8c24a759 100644
--- a/src/surah.html
+++ b/src/surah.html
@@ -3,6 +3,7 @@
   <head>
     <title>Al-Quran: Loading</title>
     <link rel="stylesheet" href="/css/surah.css">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
   </head>
   <body>
     <div class="surah"></div>
