glyph.css

@@ -20,6 +20,18 @@ div.space {
   margin: 64px;
 }
 
+body {
+  margin: 0;
+  padding: 0;
+}
+
+h1 {
+  background-color: #aaa;
+  margin-top: 0;
+  padding-top: 1em;
+  padding-left: 0.5em;
+}
+
 footer p {
   font-size: small;
   margin: 0;

index.html

@@ -20,11 +20,14 @@
       <p><a href="http://www.unicode.org/charts/PDF/U12000.pdf">unicode cuneiform</a></p>
     </footer>
     <script>
+      // Update the cuneiform whenever the input changes.
       var input = document.querySelector('input');
       input.addEventListener('input', function(event)  {
         var cuneiform = convert(event.target.value);
         document.querySelector('#cuneiform').textContent = cuneiform;
       });
+      // Handle any preloaded transliteration text.
+      input.dispatchEvent(new Event('input'));
     </script>
   </body>
 </html>