Permalink
Browse files

Added viewport meta tag

  • Loading branch information...
1 parent 41165f6 commit 7d33b7ddfeafbd29c5cadbabfcc6c0e61b5b1bb5 @stopsatgreen committed May 17, 2013
@@ -2,11 +2,13 @@
<html>
<head>
<meta charset="utf-8">
+ <meta name="viewport" content="width=device-width">
<title>Device Pixel Ratio - Chapter 03</title>
</head>
<body>
<script>
document.addEventListener('DOMContentLoaded', function() {
+ 'use strict';
var msg, dpr = window.devicePixelRatio;
if (dpr) {
msg = 'devicePixelRatio: ' + dpr;
@@ -2,6 +2,7 @@
<html>
<head>
<meta charset="utf-8">
+ <meta name="viewport" content="width=device-width">
<title></title>
<style>
body { margin: 0; }
@@ -1,8 +1,9 @@
<!DOCTYPE html>
<html>
<head>
- <title>matchMedia matches - Chapter 03</title>
<meta charset="utf-8">
+ <meta name="viewport" content="width=device-width">
+ <title>matchMedia matches - Chapter 03</title>
</head>
<body>
<script>
@@ -1,8 +1,8 @@
<!DOCTYPE html>
<html>
<head>
- <meta name="viewport" content="width=device-width">
<meta charset="utf-8">
+ <meta name="viewport" content="width=device-width">
<title>Media queries - Chapter 03</title>
<style>
body { text-align: center; }
@@ -1,8 +1,9 @@
<!DOCTYPE html>
<html>
<head>
- <title>matchMedia listener - Chapter 03</title>
<meta charset="utf-8">
+ <meta name="viewport" content="width=device-width">
+ <title>matchMedia listener - Chapter 03</title>
</head>
<body>
<script>
@@ -2,13 +2,23 @@
<html>
<head>
<meta charset="utf-8">
+ <meta name="viewport" content="width=device-width">
<title>Object position - Chapter 03</title>
<link rel="stylesheet" href="../bootstrap/css/bootstrap.css">
<style>
.holder { margin: 0 auto; }
- .holder div { background-color: red; float: left; height: 250px; overflow: hidden; width: 32%; }
+ .holder div {
+ background-color: red;
+ float: left;
+ height: 250px;
+ overflow: hidden;
+ width: 32%;
+ }
div.middle { margin: 0 2%; }
- img { height: 100%; width: 100%; }
+ img {
+ height: 100%;
+ width: 100%;
+ }
#obj-fill { -o-object-fit: fill; }
#obj-contain { -o-object-fit: contain; }
#obj-cover { -o-object-fit: cover; }
@@ -2,13 +2,24 @@
<html>
<head>
<meta charset="utf-8">
+ <meta name="viewport" content="width=device-width">
<title>Object position - Chapter 03</title>
<link rel="stylesheet" href="../bootstrap/css/bootstrap.css">
<style>
.holder { margin: 0 auto; }
- .holder div { background-color: red; float: left; height: 250px; overflow: hidden; width: 32%; }
+ .holder div {
+ background-color: red;
+ float: left;
+ height: 250px;
+ overflow: hidden;
+ width: 32%;
+ }
div.middle { margin: 0 2%; }
- img { height: 100%; width: 100%; -o-object-fit: contain; }
+ img {
+ height: 100%;
+ width: 100%;
+ -o-object-fit: contain;
+ }
#obj-1 { -o-object-position: center top; }
#obj-2 { -o-object-position: center bottom; }
#obj-3 { -o-object-position: right; }

0 comments on commit 7d33b7d

Please sign in to comment.