Skip to content

Commit 6755111

Browse files
greggmangreggman
committed
Fix CSS
There was a time when 100vh was correct but mobile browsers changed.
1 parent bf44f7a commit 6755111

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

46 files changed

+213
-145
lines changed

‎examples/2d-array-texture.html‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -29,14 +29,15 @@
2929

3030
<title>twgl.js - twgl cube</title>
3131
<style>
32-
body {
32+
html, body {
3333
margin: 0;
3434
font-family: monospace;
35+
height: 100%;
3536
}
3637
canvas {
3738
display: block;
38-
width: 100vw;
39-
height: 100vh;
39+
width: 100%;
40+
height: 100%;
4041
}
4142
#b {
4243
position: absolute;

‎examples/2d-lines.html‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -29,14 +29,15 @@
2929

3030
<title>twgl.js - 2d lines</title>
3131
<style>
32-
body {
32+
html, body {
3333
margin: 0;
3434
font-family: monospace;
35+
height: 100%;
3536
}
3637
canvas {
3738
display: block;
38-
width: 100vw;
39-
height: 100vh;
39+
width: 100%;
40+
height: 100%;
4041
}
4142
#b {
4243
position: absolute;

‎examples/2d-rotation.html‎

Lines changed: 14 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -14,10 +14,21 @@
1414

1515
<link href="/resources/images/twgljs-icon.png" rel="shortcut icon" type="image/png">
1616
<title>twgl.js - 2d-rotation</title>
17+
<style>
18+
html, body {
19+
margin: 0;
20+
font-family: monospace;
21+
height: 100%;
22+
}
23+
canvas {
24+
width: 100%;
25+
height: 100%;
26+
display: block;
27+
}
28+
</style>
1729
</head>
18-
<body style="margin:0; overflow: hidden; font-family: monospace;">
19-
20-
<canvas id="canvasgl" style="height: 100vh; width: 100vw;"></canvas>
30+
<body>
31+
<canvas id="canvasgl"></canvas>
2132
<div id="b" style="position: absolute; top: 10px; width: 100%; text-align: center; z-index: 2;"><a href="http://twgljs.org">twgl.js</a> - 2d-rotation</div>
2233
<script type="module">
2334
import * as twgl from '../dist/7.x/twgl-full.module.js';

‎examples/3d-texture-volume-no-buffers.html‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -29,14 +29,15 @@
2929

3030
<title>twgl.js - 3d textures</title>
3131
<style>
32-
body {
32+
html, body {
3333
margin: 0;
3434
font-family: monospace;
3535
color: white;
36+
height: 100%;
3637
}
3738
canvas {
38-
width: 100vw;
39-
height: 100vh;
39+
width: 100%;
40+
height: 100%;
4041
}
4142
a {
4243
color: lightblue;

‎examples/3d-texture-volume.html‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -29,14 +29,15 @@
2929

3030
<title>twgl.js - 3d textures</title>
3131
<style>
32-
body {
32+
html, body {
3333
margin: 0;
3434
font-family: monospace;
3535
color: white;
36+
height: 100%;
3637
}
3738
canvas {
38-
width: 100vw;
39-
height: 100vh;
39+
width: 100%;
40+
height: 100%;
4041
}
4142
a {
4243
color: lightblue;

‎examples/3d-textures-tone-mapping.html‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -29,14 +29,15 @@
2929

3030
<title>twgl.js - 3d textures</title>
3131
<style>
32-
body {
32+
html, body {
3333
margin: 0;
3434
font-family: monospace;
3535
color: white;
36+
height: 100%;
3637
}
3738
canvas {
38-
width: 100vw;
39-
height: 100vh;
39+
width: 100%;
40+
height: 100%;
4041
}
4142
a {
4243
color: lightblue;

‎examples/amd-compiled.html‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -29,14 +29,15 @@
2929

3030
<title>twgl.js - amd compiled</title>
3131
<style>
32-
body {
32+
html, body {
3333
margin: 0;
3434
font-family: monospace;
35+
height: 100%;
3536
}
3637
canvas {
3738
display: block;
38-
width: 100vw;
39-
height: 100vh;
39+
width: 100%;
40+
height: 100%;
4041
}
4142
#b {
4243
position: absolute;

‎examples/browserify.html‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -29,14 +29,15 @@
2929

3030
<title>twgl.js - amd</title>
3131
<style>
32-
body {
32+
html, body {
3333
margin: 0;
3434
font-family: monospace;
35+
height: 100%;
3536
}
3637
canvas {
3738
display: block;
38-
width: 100vw;
39-
height: 100vh;
39+
width: 100%;
40+
height: 100%;
4041
}
4142
#b {
4243
position: absolute;

‎examples/camera.html‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -29,14 +29,15 @@
2929

3030
<title>twgl.js - camera</title>
3131
<style>
32-
body {
32+
html, body {
3333
margin: 0;
3434
font-family: monospace;
35+
height: 100%;
3536
}
3637
canvas {
3738
display: block;
38-
width: 100vw;
39-
height: 100vh;
39+
width: 100%;
40+
height: 100%;
4041
}
4142
#b {
4243
position: absolute;

‎examples/clamped-array.html‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -29,14 +29,15 @@
2929

3030
<title>twgl.js - clampedarrays</title>
3131
<style>
32-
body {
32+
html, body {
3333
margin: 0;
3434
font-family: monospace;
35+
height: 100%;
3536
}
3637
canvas {
3738
display: block;
38-
width: 100vw;
39-
height: 100vh;
39+
width: 100%;
40+
height: 100%;
4041
}
4142
#b {
4243
position: absolute;

0 commit comments

Comments
 (0)