Changeset 2590

Timestamp:

02/24/2016 09:17:13 PM (10 years ago)

Author:

coffee2code

Message:

Browse Happy: More responsive tweaks.

• Add margin-top to browser blocks so they don't slighly overlap when they wrap.
• Add breakpoints where each browser block wraps so overall margins are maintained.
• Decrease h1 font size at smaller width.

File:

• sites/trunk/browsehappy.com/public_html/style.css (modified) (3 diffs)

sites/trunk/browsehappy.com/public_html/style.css

@@ -269 +269 @@
     width: 192px;
     float: left;
-    margin: 0;
+    margin: 12px 0 0;
 }
 
@@ -548 +548 @@
 }
 
+@media (max-width: 1168px) { #main .wrap { max-width: 960px; } }
+@media (max-width: 976px)  { #main .wrap { max-width: 768px; } }
+@media (max-width: 784px)  { #main .wrap { max-width: 576px; } }
+@media (max-width: 592px)  { #main .wrap { max-width: 384px; } }
+@media (max-width: 500px) {
+    header h1 {
+        font-size: 900%;
+    }
+}
 @media (max-width: 430px) {
     header {
@@ -564 +573 @@
         float: none;
         margin: 0 auto;
+    }
+    header h1 {
+        font-size: 600%;
     }
 }