making improvements to media queries examples

chrisdavidmills · chrisdavidmills · commit 63b89d488055 · 2020-06-29T14:31:44.000+01:00
diff --git a/learn/media-queries/and.html b/learn/media-queries/and.html
@@ -8,7 +8,7 @@
         font-size: 1em;
       }
 
-      @media screen and (min-width: 400px) and (orientation: landscape) {
+      @media screen and (min-width: 600px) and (orientation: landscape) {
         body {
           color: blue;
         }
@@ -18,11 +18,11 @@
 
 <body>
 
-    
+
   <p>One November night in the year 1782, so the story runs, two brothers sat over their winter fire in the little French town of Annonay, watching the grey smoke-wreaths from the hearth curl up the wide chimney. Their names were Stephen and Joseph Montgolfier, they were papermakers by trade, and were noted as possessing thoughtful minds and a deep interest in all scientific knowledge and new discovery.</p>
   <p>Before that night—a memorable night, as it was to prove—hundreds of millions of people had watched the rising smoke-wreaths of their fires without drawing any special inspiration from the fact.”</p>
 
 
 </body>
 
-</html>
+</html>
diff --git a/learn/media-queries/max-width.html b/learn/media-queries/max-width.html
@@ -8,7 +8,7 @@
         font-size: 1em;
       }
 
-      @media screen and (max-width: 400px) {
+      @media screen and (max-width: 600px) {
         body {
           color: blue;
         }
@@ -18,11 +18,11 @@
 
 <body>
 
-    
+
   <p>One November night in the year 1782, so the story runs, two brothers sat over their winter fire in the little French town of Annonay, watching the grey smoke-wreaths from the hearth curl up the wide chimney. Their names were Stephen and Joseph Montgolfier, they were papermakers by trade, and were noted as possessing thoughtful minds and a deep interest in all scientific knowledge and new discovery.</p>
   <p>Before that night—a memorable night, as it was to prove—hundreds of millions of people had watched the rising smoke-wreaths of their fires without drawing any special inspiration from the fact.”</p>
 
 
 </body>
 
-</html>
+</html>
diff --git a/learn/media-queries/or.html b/learn/media-queries/or.html
@@ -8,7 +8,7 @@
         font-size: 1em;
       }
 
-      @media screen and (min-width: 400px), screen and  (orientation: landscape) {
+      @media screen and (min-width: 600px), screen and  (orientation: landscape) {
         body {
           color: blue;
         }
@@ -18,11 +18,11 @@
 
 <body>
 
-    
+
   <p>One November night in the year 1782, so the story runs, two brothers sat over their winter fire in the little French town of Annonay, watching the grey smoke-wreaths from the hearth curl up the wide chimney. Their names were Stephen and Joseph Montgolfier, they were papermakers by trade, and were noted as possessing thoughtful minds and a deep interest in all scientific knowledge and new discovery.</p>
   <p>Before that night—a memorable night, as it was to prove—hundreds of millions of people had watched the rising smoke-wreaths of their fires without drawing any special inspiration from the fact.”</p>
 
 
 </body>
 
-</html>
+</html>
diff --git a/learn/media-queries/step1.html b/learn/media-queries/step1.html
@@ -3,6 +3,7 @@
   <head>
     <meta charset="utf-8" />
     <title>Media Queries: a simple mobile first design, step 1</title>
+    <meta name="viewport" content="width=device-width">
     <style>
       * {
         box-sizing: border-box;
diff --git a/learn/media-queries/step2.html b/learn/media-queries/step2.html
@@ -3,6 +3,7 @@
   <head>
     <meta charset="utf-8" />
     <title>Media Queries: a simple mobile first design, step 2</title>
+    <meta name="viewport" content="width=device-width">
     <style>
       * {
         box-sizing: border-box;
diff --git a/learn/media-queries/step3.html b/learn/media-queries/step3.html
@@ -3,6 +3,7 @@
   <head>
     <meta charset="utf-8" />
     <title>Media Queries: a simple mobile first design, step 3</title>
+    <meta name="viewport" content="width=device-width">
     <style>
       * {
         box-sizing: border-box;
