move note under new paragraph

source

@@ -48205,6 +48205,33 @@ interface <dfn interface>HTMLInputElement</dfn> : <span>HTMLElement</span> {
   when its <code data-x="attr-input-type">type</code> attribute is in the <span
   data-x="attr-input-type-file">File Upload</span> state.</p>
 
+  <div class="note">
+   <p>As of the time of this writing, typical browser implementations show such picker UI for:</p>
+
+   <ul>
+    <li><p><code>input</code> elements whose <code data-x="attr-input-type">type</code>
+    attributes are in the <span data-x="attr-input-type-date">Date</span>, <span
+    data-x="attr-input-type-month">Month</span>, <span data-x="attr-input-type-week">Week</span>,
+    <span data-x="attr-input-type-time">Time</span>, <span
+    data-x="attr-input-type-datetime-local">Local Date and Time</span>, and <span
+    data-x="attr-input-type-color">Color</span> states;</p></li>
+
+    <li><p><code>input</code> elements in various states that have a <span
+    data-x="concept-input-list">suggestions source element</span>;</p></li>
+
+    <li><p><code>input</code> elements whose <code data-x="attr-input-type">type</code> attribute
+    is in the <span data-x="attr-input-type-file">File Upload</span> state (although those are
+    handled via the special case above, instead of by this step); and</p></li>
+
+    <li><p><code>select</code> elements.</p></li>
+   </ul>
+
+   <p>However, the intent of this step is to trigger <em>any</em> picker UI implementation. So
+   for example, if a user agent implemented a password picker UI for the <span
+   data-x="attr-input-type-password">Password</span> state, then this method would be expected to
+   show that picker UI when called on a password input.</p>
+  </div>
+
   <p>The <span data-x="concept-node-clone-ext">cloning steps</span> for <code>input</code> elements
   must propagate the <span data-x="concept-fe-value">value</span>, <span
   data-x="concept-fe-dirty">dirty value flag</span>, <span
@@ -53223,33 +53250,6 @@ You cannot submit this form when the field is incorrect.</samp></pre>
     firing either <code data-x="event-input">input</code> and <code
     data-x="event-change">change</code> events, or a <code data-x="event-cancel">cancel</code>
     event.)</p>
-
-    <div class="note">
-     <p>As of the time of this writing, typical browser implementations show such picker UI for:</p>
-
-     <ul>
-      <li><p><code>input</code> elements whose <code data-x="attr-input-type">type</code>
-      attributes are in the <span data-x="attr-input-type-date">Date</span>, <span
-      data-x="attr-input-type-month">Month</span>, <span data-x="attr-input-type-week">Week</span>,
-      <span data-x="attr-input-type-time">Time</span>, <span
-      data-x="attr-input-type-datetime-local">Local Date and Time</span>, and <span
-      data-x="attr-input-type-color">Color</span> states;</p></li>
-
-      <li><p><code>input</code> elements in various states that have a <span
-      data-x="concept-input-list">suggestions source element</span>;</p></li>
-
-      <li><p><code>input</code> elements whose <code data-x="attr-input-type">type</code> attribute
-      is in the <span data-x="attr-input-type-file">File Upload</span> state (although those are
-      handled via the special case above, instead of by this step); and</p></li>
-
-      <li><p><code>select</code> elements.</p></li>
-     </ul>
-
-     <p>However, the intent of this step is to trigger <em>any</em> picker UI implementation. So
-     for example, if a user agent implemented a password picker UI for the <span
-     data-x="attr-input-type-password">Password</span> state, then this method would be expected to
-     show that picker UI when called on a password input.</p>
-    </div>
    </li>
   </ol>