Fix rendering issues with Mobile Outlook and Gmail

TedGoas · TedGoas · commit 3cdf12f7b2b8 · 2018-10-09T16:50:58.000-04:00
All mobile Outlook’s and Gmail’s should be full-bleed. Mobile Outlook also appears **not* to cut off emails like so: #184 (comment) Fixes #184 and references #108
diff --git a/cerberus-fluid.html b/cerberus-fluid.html
@@ -107,19 +107,19 @@
 
         /* iPhone 4, 4S, 5, 5S, 5C, and 5SE */
         @media only screen and (min-device-width: 320px) and (max-device-width: 374px) {
-            .email-container {
+            u ~ div .email-container {
                 min-width: 320px !important;
             }
         }
         /* iPhone 6, 6S, 7, 8, and X */
         @media only screen and (min-device-width: 375px) and (max-device-width: 413px) {
-            .email-container {
+            u ~ div .email-container {
                 min-width: 375px !important;
             }
         }
         /* iPhone 6+, 7+, and 8+ */
         @media only screen and (min-device-width: 414px) {
-            .email-container {
+            u ~ div .email-container {
                 min-width: 414px !important;
             }
         }
diff --git a/cerberus-hybrid.html b/cerberus-hybrid.html
@@ -107,19 +107,19 @@
 
         /* iPhone 4, 4S, 5, 5S, 5C, and 5SE */
         @media only screen and (min-device-width: 320px) and (max-device-width: 374px) {
-            .email-container {
+            u ~ div .email-container {
                 min-width: 320px !important;
             }
         }
         /* iPhone 6, 6S, 7, 8, and X */
         @media only screen and (min-device-width: 375px) and (max-device-width: 413px) {
-            .email-container {
+            u ~ div .email-container {
                 min-width: 375px !important;
             }
         }
         /* iPhone 6+, 7+, and 8+ */
         @media only screen and (min-device-width: 414px) {
-            .email-container {
+            u ~ div .email-container {
                 min-width: 414px !important;
             }
         }
diff --git a/cerberus-responsive.html b/cerberus-responsive.html
@@ -107,19 +107,19 @@
 
         /* iPhone 4, 4S, 5, 5S, 5C, and 5SE */
         @media only screen and (min-device-width: 320px) and (max-device-width: 374px) {
-            .email-container {
+            u ~ div .email-container {
                 min-width: 320px !important;
             }
         }
         /* iPhone 6, 6S, 7, 8, and X */
         @media only screen and (min-device-width: 375px) and (max-device-width: 413px) {
-            .email-container {
+            u ~ div .email-container {
                 min-width: 375px !important;
             }
         }
         /* iPhone 6+, 7+, and 8+ */
         @media only screen and (min-device-width: 414px) {
-            .email-container {
+            u ~ div .email-container {
                 min-width: 414px !important;
             }
         }

Original file line number	Diff line number	Diff line change
`@@ -107,19 +107,19 @@`
`107`	`107`
`108`	`108`	`/* iPhone 4, 4S, 5, 5S, 5C, and 5SE */`
`109`	`109`	`@media only screen and (min-device-width: 320px) and (max-device-width: 374px) {`
`110`		`- .email-container {`
	`110`	`+ u ~ div .email-container {`
`111`	`111`	`min-width: 320px !important;`
`112`	`112`	`}`
`113`	`113`	`}`
`114`	`114`	`/* iPhone 6, 6S, 7, 8, and X */`
`115`	`115`	`@media only screen and (min-device-width: 375px) and (max-device-width: 413px) {`
`116`		`- .email-container {`
	`116`	`+ u ~ div .email-container {`
`117`	`117`	`min-width: 375px !important;`
`118`	`118`	`}`
`119`	`119`	`}`
`120`	`120`	`/* iPhone 6+, 7+, and 8+ */`
`121`	`121`	`@media only screen and (min-device-width: 414px) {`
`122`		`- .email-container {`
	`122`	`+ u ~ div .email-container {`
`123`	`123`	`min-width: 414px !important;`
`124`	`124`	`}`
`125`	`125`	`}`