diff --git a/mail/templates/default/app.css b/mail/templates/default/app.css
index 1dfbb314e0..bb4cd49a64 100644
--- a/mail/templates/default/app.css
+++ b/mail/templates/default/app.css
@@ -796,17 +796,25 @@ blockquote blockquote blockquote blockquote blockquote blockquote{
 	}
 }
 
-/* MOBILE (Portrait & Landscape) View --------------*/
+/* MOBILE and tablets (Portrait & Landscape) View --------------*/
 @media only screen and (max-device-width:1024px) {
 	div#mail-index_nm {
-			height: 100% !important;
+			/*height: 100% !important;*/
 	}
 	/*Disable the preview spliter*/
 	div#mail-index_mailPreview, div.splitter-bar {
 		display: none !important;
 	}
 
-	
+	div.mailDisplayContainer{
+		margin-top: 30px;
+		margin-left:0;
+		height: auto;
+	}
+
+	div#mail-display.et2_container {
+		min-height: initial;
+	}
 }
 /* tablets and smartphones (portrait) ----------- */
 @media only screen
diff --git a/mail/templates/pixelegg/app.css b/mail/templates/pixelegg/app.css
index 1d42085927..f0044e9e85 100755
--- a/mail/templates/pixelegg/app.css
+++ b/mail/templates/pixelegg/app.css
@@ -789,16 +789,24 @@ blockquote blockquote blockquote blockquote blockquote blockquote {
     padding-top: 10px;
   }
 }
-/* MOBILE (Portrait & Landscape) View --------------*/
+/* MOBILE and tablets (Portrait & Landscape) View --------------*/
 @media only screen and (max-device-width: 1024px) {
   div#mail-index_nm {
-    height: 100% !important;
+    /*height: 100% !important;*/
   }
   /*Disable the preview spliter*/
   div#mail-index_mailPreview,
   div.splitter-bar {
     display: none !important;
   }
+  div.mailDisplayContainer {
+    margin-top: 30px;
+    margin-left: 0;
+    height: auto;
+  }
+  div#mail-display.et2_container {
+    min-height: initial;
+  }
 }
 /* tablets and smartphones (portrait) ----------- */
 @media only screen and (max-device-width: 1024px) and (orientation: portrait) {