js: Remove align=center from main <div> and make it a <main>

Instead of an align=center HTML attribute, we now centre its contents
using CSS.  Also, this element contains all the important contents of
the page, so it seems appropriate to us the HTML5 <main> element for
this.

1 files changed, 7 insertions, 4 deletions

diff --git a/html/jspage.pl b/html/jspage.pl
index d52113e..80f3650 100755
--- a/html/jspage.pl
+++ b/html/jspage.pl
@@ -85,6 +85,10 @@ EOF
     text-align: center
 }
 
+main {
+    text-align: center;
+}
+
 /* Inside that form, the main menu bar and every submenu inside it is a <ul> */
 #gamemenu ul {
     list-style: none;  /* get rid of the normal unordered-list bullets */
@@ -294,8 +298,7 @@ EOF
 
 #resizable {
     position: relative;
-    left: 0;
-    top: 0;
+    margin: 0 auto;
 }
 
 #puzzlecanvas {
@@ -328,7 +331,7 @@ ${unfinishedheading}
 ${unfinishedpara}
 
 <hr>
-<div id="puzzle" style="display: none" align=center>
+<main id="puzzle" style="display: none">
 <form id="gamemenu"><ul>
   <li><div tabindex="0">Game<ul>
     <li><button type="button" id="specific">Enter game ID...</button></li>
@@ -366,7 +369,7 @@ ${unfinishedpara}
     <a id="permalink-desc">by game ID</a>
     <a id="permalink-seed">by random seed</a>
   </p>
-</div>
+</main>
 <div id="apology">
 <p class="apology-title">If you've been reading this message for more
 than a second or two, then <strong>this WebAssembly puzzle doesn't