Make the hosted page responsive based on min-width rather than pixel density.
[skeletonkey.git] / core.css
index fe48e8059007eca5e69602b792ffee1388bb6cb8..341f2ae92612fcf72c47c7a825bd63bde0dced7e 100644 (file)
--- a/core.css
+++ b/core.css
@@ -80,8 +80,25 @@ hr {
   clear: both;
 }
 
-@media screen and (-webkit-min-device-pixel-ratio: 1.5) {
+@media screen and (max-width: 800px) {
   body {
-    font-size: 1.1em;
+    margin: 0;
+    padding: 0;
+    width: 90%;
+  }
+
+  li input {
+    display: block;
+    width: 100%;
+  }
+
+  li label {
+    text-align: left;
+  }
+
+  li button {
+    float: none;
+    width: 100%;
+    margin: 0;
   }
 }