use mobile-specific metas in our examples, and add a media query to remove padding and set map width to page width on small scth on small-screen devices, r=aabt (closes #3067)

git-svn-id: http://svn.openlayers.org/trunk/openlayers@11158 dc9f47b5-9b13-0410-9fdd-eb0c1a62fdaf

examples/style.css

@@ -84,3 +84,40 @@ h6 {
 #docs p {
     margin-bottom: 0.5em;
 }
+/* mobile specific */
+@media only screen and (max-width: 600px) {
+    body {
+        height           : 100%;
+        margin           : 0;
+        padding          : 0;
+        width            : 100%;
+    }
+    #map {
+        background : #7391ad;
+        width      : 100%;
+    }
+    #map {
+        border : 0;
+        height : 250px;
+    }
+    #title {
+        font-size   : 1.3em;
+        line-height : 2em;
+        text-indent : 1em;
+        margin      : 0;
+        padding     : 0;
+    }
+    #docs {
+        bottom     : 0;
+        padding    : 1em;
+    }
+    #shortdesc {
+        color      : #aaa;
+        font-size  : 0.8em;
+        padding    : 1em;
+        text-align : right;
+    }
+    #tags {
+        display : none;
+    }
+}