Page layout is now a bit more compact

1 files changed, 10 insertions, 1 deletions

diff --git a/index.html b/index.html
index 0e78684..d653032 100644
--- a/index.html
+++ b/index.html
@@ -3,9 +3,16 @@
 <meta charset="utf-8">
 <title>Wadsworth/Wheatstone</title>
 <style>
+body {
+	display: flex;
+	align-items: center;
+	max-width: 45em;
+	margin: 0 auto;
+	padding: 0.5em;
+}
+.controls { padding: 0.5em; }
 svg {
 	display: block;
-	margin: 1em auto;
 	border: 1px solid black;
 }
 .pointer, .plate {
@@ -119,7 +126,9 @@ function init(element) {
 	<circle onmousedown="start(this.parentNode)" cx="75" cy="50" r="5"/>
 </g>
 </svg>
+<div class="controls">
 <strong>Wadsworth/Wheatstone</strong><br>
 Outer: <input onchange='change("#outer", this.value)' type="number" value="27" autocomplete="off"><br>
 Inner: <input onchange='change("#inner", this.value)' type="number" value="26" autocomplete="off"><br>
 <button onclick="reset()">Reset Position</button>
+</div>