Combobox examples with list popups: Fix missing closing LI in accessibility features section (pull #2079)

nschonni · web-flow · commit 7e997a0f21fc · 2021-10-31T09:41:31.000-07:00
diff --git a/examples/combobox/combobox-autocomplete-both.html b/examples/combobox/combobox-autocomplete-both.html
@@ -147,13 +147,14 @@ <h2>Accessibility Features</h2>
               When an element loses focus, its border changes from two pixels to two and padding is increased by two pixels.
             </li>
           </ul>
-          <li>
-            To ensure the inline SVG graphic used for the arrow in the open button has sufficient contrast with the background when high contrast settings change the color of text content,
-            CSS <code>forced-color-adjust</code> is set to <code>auto</code> on the <code>svg</code> element and and the <code>fill</code> attribute of the <code>polygon</code> element is set to <code>currentColor</code>.
-            This causes the colors of the <code>fill</code> of the polygon elements to be overridden by the high contrast color setting.
-            If <code>forced-color-adjust</code> were not used to override the colors specified for the <code>fill</code> property, the color would remain the same in high contrast mode, which could lead to insufficient contrast between the arrow and the background or even make it invisible if the color matched the high contrast mode background.<br>
-            Note: The explicit setting of <code>forced-color-adjust</code> is necessary because some browsers do not use <code>auto</code> as the default value for SVG graphics.
-          </li>
+        </li>
+        <li>
+          To ensure the inline SVG graphic used for the arrow in the open button has sufficient contrast with the background when high contrast settings change the color of text content,
+          CSS <code>forced-color-adjust</code> is set to <code>auto</code> on the <code>svg</code> element and and the <code>fill</code> attribute of the <code>polygon</code> element is set to <code>currentColor</code>.
+          This causes the colors of the <code>fill</code> of the polygon elements to be overridden by the high contrast color setting.
+          If <code>forced-color-adjust</code> were not used to override the colors specified for the <code>fill</code> property, the color would remain the same in high contrast mode, which could lead to insufficient contrast between the arrow and the background or even make it invisible if the color matched the high contrast mode background.<br>
+          Note: The explicit setting of <code>forced-color-adjust</code> is necessary because some browsers do not use <code>auto</code> as the default value for SVG graphics.
+        </li>
       </ul>
     </section>
 
diff --git a/examples/combobox/combobox-autocomplete-list.html b/examples/combobox/combobox-autocomplete-list.html
@@ -148,13 +148,14 @@ <h2>Accessibility Features</h2>
               When an element loses focus, its border changes from two pixels to two and padding is increased by two pixels.
             </li>
           </ul>
-          <li>
-            To ensure the inline SVG graphic used for the arrow in the open button has sufficient contrast with the background when high contrast settings change the color of text content,
-            CSS <code>forced-color-adjust</code> is set to <code>auto</code> on the <code>svg</code> element and and the <code>fill</code> attribute of the <code>polygon</code> element is set to <code>currentColor</code>.
-            This causes the colors of the <code>fill</code> of the polygon elements to be overridden by the high contrast color setting.
-            If <code>forced-color-adjust</code> were not used to override the colors specified for the <code>fill</code> property, the color would remain the same in high contrast mode, which could lead to insufficient contrast between the arrow and the background or even make it invisible if the color matched the high contrast mode background.<br>
-            Note: The explicit setting of <code>forced-color-adjust</code> is necessary because some browsers do not use <code>auto</code> as the default value for SVG graphics.
-          </li>
+        </li>
+        <li>
+          To ensure the inline SVG graphic used for the arrow in the open button has sufficient contrast with the background when high contrast settings change the color of text content,
+          CSS <code>forced-color-adjust</code> is set to <code>auto</code> on the <code>svg</code> element and and the <code>fill</code> attribute of the <code>polygon</code> element is set to <code>currentColor</code>.
+          This causes the colors of the <code>fill</code> of the polygon elements to be overridden by the high contrast color setting.
+          If <code>forced-color-adjust</code> were not used to override the colors specified for the <code>fill</code> property, the color would remain the same in high contrast mode, which could lead to insufficient contrast between the arrow and the background or even make it invisible if the color matched the high contrast mode background.<br>
+          Note: The explicit setting of <code>forced-color-adjust</code> is necessary because some browsers do not use <code>auto</code> as the default value for SVG graphics.
+        </li>
       </ul>
     </section>
 
diff --git a/examples/combobox/combobox-autocomplete-none.html b/examples/combobox/combobox-autocomplete-none.html
@@ -103,13 +103,14 @@ <h2>Accessibility Features</h2>
               When an element loses focus, its border changes from two pixels to two and padding is increased by two pixels.
             </li>
           </ul>
-          <li>
-            To ensure the inline SVG graphic used for the arrow in the open button has sufficient contrast with the background when high contrast settings change the color of text content,
-            CSS <code>forced-color-adjust</code> is set to <code>auto</code> on the <code>svg</code> element and and the <code>fill</code> attribute of the <code>polygon</code> element is set to <code>currentColor</code>.
-            This causes the colors of the <code>fill</code> of the polygon elements to be overridden by the high contrast color setting.
-            If <code>forced-color-adjust</code> were not used to override the colors specified for the <code>fill</code> property, the color would remain the same in high contrast mode, which could lead to insufficient contrast between the arrow and the background or even make it invisible if the color matched the high contrast mode background.<br>
-            Note: The explicit setting of <code>forced-color-adjust</code> is necessary because some browsers do not use <code>auto</code> as the default value for SVG graphics.
-          </li>
+        </li>
+        <li>
+          To ensure the inline SVG graphic used for the arrow in the open button has sufficient contrast with the background when high contrast settings change the color of text content,
+          CSS <code>forced-color-adjust</code> is set to <code>auto</code> on the <code>svg</code> element and and the <code>fill</code> attribute of the <code>polygon</code> element is set to <code>currentColor</code>.
+          This causes the colors of the <code>fill</code> of the polygon elements to be overridden by the high contrast color setting.
+          If <code>forced-color-adjust</code> were not used to override the colors specified for the <code>fill</code> property, the color would remain the same in high contrast mode, which could lead to insufficient contrast between the arrow and the background or even make it invisible if the color matched the high contrast mode background.<br>
+          Note: The explicit setting of <code>forced-color-adjust</code> is necessary because some browsers do not use <code>auto</code> as the default value for SVG graphics.
+        </li>
       </ul>
     </section>
 
