bring checkbox to the left

Author: neverRare

dist/index.html

@@ -95,16 +95,12 @@ <h1>
           target="_blank"
         >(Help)</a>
       </h1>
-      <label>
-        Use telo misikeke error messages
-        <input type="checkbox" id="telo-misikeke" />
-      </label>
-      <label>
-        Randomize output order <input type="checkbox" id="randomize" />
-      </label>
-      <label>
-        Multiline input <input type="checkbox" id="multiline" />
-      </label>
+      <label><input type="checkbox" id="telo-misikeke" />
+        Use telo misikeke error messages</label>
+      <label><input type="checkbox" id="randomize" />
+        Randomize output order</label>
+      <label><input type="checkbox" id="multiline" />
+        Multiline input</label>
       <label for="quantity">Singular and plural forms</label>
       <select id="quantity">
         <option value="both">Show all</option>
@@ -119,14 +115,10 @@ <h1>
       </select>
       <details>
         <summary>Advance settings</summary>
-        <label>
-          Allow X ala X partial parsing
-          <input type="checkbox" id="x-ala-x-partial-parsing" />
-        </label>
-        <label>
-          Allow separate repeated modifiers
-          <input type="checkbox" id="separate-repeated-modifiers" />
-        </label>
+        <label><input type="checkbox" id="x-ala-x-partial-parsing" />
+          Allow X ala X partial parsing</label>
+        <label><input type="checkbox" id="separate-repeated-modifiers" />
+          Allow separate repeated modifiers</label>
       </details>
       <div>
         <button id="reset-button">Reset to default</button>

dist/style.css

@@ -88,10 +88,8 @@ dialog > div > input[type="text"] {
   flex-grow: 1;
 }
 dialog input[type="checkbox"] {
-  margin-left: 10px;
   width: 1em;
   height: 1em;
-  float: right;
 }
 @media (min-width: 800px) {
   body {