new repository

1 files changed, 129 insertions, 0 deletions

diff --git a/devdocs/html/attributes%2Fmin.html b/devdocs/html/attributes%2Fmin.html
new file mode 100644
index 00000000..260da1ae
--- /dev/null
+++ b/devdocs/html/attributes%2Fmin.html
@@ -0,0 +1,129 @@
+<header><h1>HTML attribute: min</h1></header><div class="section-content">
+<p>The <code>min</code> attribute defines the minimum value that is acceptable and valid for the input containing the attribute. If the <a href="../element/input#value"><code>value</code></a> of the element is less than this, the element fails <a href="https://developer.mozilla.org/en-US/docs/Learn/Forms/Form_validation">validation</a>. This value must be less than or equal to the value of the <code>max</code> attribute.</p> <p>Some input types have a default minimum. If the input has no default minimum and a value is specified for <code>min</code> that can't be converted to a valid number (or no minimum value is set), the input has no minimum value.</p> <p>It is valid for the input types including: <a href="../element/input/date">date</a>, <a href="../element/input/month">month</a>, <a href="../element/input/week">week</a>, <a href="../element/input/time">time</a>, <a href="../element/input/datetime-local">datetime-local</a>, <a href="../element/input/number">number</a> and <a href="../element/input/range">range</a> types, and the <a href="../element/meter"><code>&lt;meter&gt;</code></a> element.</p>
+</div>
+<h3 id="syntax">Syntax</h3>
+<div class="section-content">
+<figure class="table-container"><div class="_table"><table class="no-markdown"> <caption> Syntax for <code>min</code> values by input <code>type</code> </caption> <thead> <tr> <th>Input type</th> <th>Syntax</th> <th>Example</th> </tr> </thead> <tbody> <tr> <td><a href="../element/input/date">date</a></td> <td><code>yyyy-mm-dd</code></td> <td><code>&lt;input type="date" min="2019-12-25" step="1"&gt;</code></td> </tr> <tr> <td><a href="../element/input/month">month</a></td> <td><code>yyyy-mm</code></td> <td><code>&lt;input type="month" min="2019-12" step="12"&gt;</code></td> </tr> <tr> <td><a href="../element/input/week">week</a></td> <td><code>yyyy-W##</code></td> <td><code>&lt;input type="week" min="2019-W23" step=""&gt;</code></td> </tr> <tr> <td><a href="../element/input/time">time</a></td> <td><code>hh:mm</code></td> <td><code>&lt;input type="time" min="09:00" step="900"&gt;</code></td> </tr> <tr> <td><a href="../element/input/datetime-local">datetime-local</a></td> <td><code>yyyy-mm-ddThh:mm</code></td> <td><code>&lt;input type="datetime-local" min="2019-12-25T19:30"&gt;</code></td> </tr> <tr> <td><a href="../element/input/number">number</a></td> <td><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/number">&lt;number&gt;</a></td> <td><code>&lt;input type="number" min="0" step="5" max="100"&gt;</code></td> </tr> <tr> <td><a href="../element/input/range">range</a></td> <td><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/number">&lt;number&gt;</a></td> <td><code>&lt;input type="range" min="60" step="5" max="100"&gt;</code></td> </tr> </tbody> </table></div></figure> <div class="notecard note" id="sect1"> <p><strong>Note:</strong> When the data entered by the user doesn't adhere to the min value set, the value is considered invalid in constraint validation and will match the <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/:invalid"><code>:invalid</code></a> and <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/:out-of-range"><code>:out-of-range</code></a> pseudo-classes.</p> </div> <p>See <a href="../constraint_validation">Client-side validation</a> and <a href="https://developer.mozilla.org/en-US/docs/Web/API/ValidityState/rangeUnderflow"><code>rangeUnderflow</code></a> for more information.</p> <p>For the <a href="../element/meter"><code>&lt;meter&gt;</code></a> element, the <code>min</code> attribute defines the lower numeric bound of the measured range. This must be less than the minimum value (<a href="max"><code>max</code></a> attribute), if specified. In both cases, if omitted, the value defaults to 1.</p> <figure class="table-container"><div class="_table"><table class="no-markdown"> <caption> Syntax for <code>min</code> values for other elements </caption> <thead> <tr> <th>Input type</th> <th>Syntax</th> <th>Example</th> </tr> </thead> <tbody> <tr> <td><a href="../element/meter"><code>&lt;meter&gt;</code></a></td> <td><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/number">&lt;number&gt;</a></td> <td><code>&lt;meter id="fuel" min="0" max="100" low="33" high="66"
+optimum="80" value="40"&gt; at 40/100&lt;/meter&gt;</code></td> </tr> </tbody> </table></div></figure>
+</div>
+<h3 id="impact_on_step">Impact on step</h3>
+<div class="section-content">
+<p>The value of <code>min</code> and <code>step</code> define what are valid values, even if the <code>step</code> attribute is not included, as <code>step</code> defaults to <code>0</code>.</p> <p>We add a big red border around invalid inputs:</p> <div class="code-example">
+<p class="example-header"><span class="language-name">css</span></p>
+<pre data-signature="6PMEpHs0vkMNWTCDnxCiFvk6vsP7Y36Lf2EE3Y3cOfI=" data-language="css"><span class="token selector">input:invalid</span> <span class="token punctuation">{</span>
+  <span class="token property">border</span><span class="token punctuation">:</span> solid red 3px<span class="token punctuation">;</span>
+<span class="token punctuation">}</span>
+</pre>
+</div> <p>Then define an input with a minimum value of 7.2, omitting the step attribute, wherein it defaults to 1.</p> <div class="code-example">
+<p class="example-header"><span class="language-name">html</span></p>
+<pre data-signature="IBE0MUa6DsxcbCQLivNNQhubuPsXnlrlV7GbPV/KSVU=" data-language="html"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>input</span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>myNumber<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>myNumber<span class="token punctuation">"</span></span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>number<span class="token punctuation">"</span></span> <span class="token attr-name">min</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>7.2<span class="token punctuation">"</span></span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>8<span class="token punctuation">"</span></span> <span class="token punctuation">/&gt;</span></span>
+</pre>
+</div> <p>Because <code>step</code> defaults to 1, valid values include <code>7.2</code>, <code>8.2</code>, <code>9.2</code>, and so on. The value 8 is not valid. As we included an invalid value, supporting browsers will show the value as invalid.</p>
+<div class="code-example" id="sect2">
+
+<iframe class="sample-code-frame" title="Impact on step sample" id="frame_impact_on_step" width="200" height="60" src="https://live.mdnplay.dev/en-US/docs/Web/HTML/Attributes/min/runner.html?id=impact_on_step" loading="lazy"></iframe>
+</div> <p>If not explicitly included, <code>step</code> defaults to 1 for <code>number</code> and <code>range</code>, and 1 unit type (second, week, month, day) for the date/time input types.</p>
+</div>
+<h2 id="accessibility_concerns">Accessibility concerns</h2>
+<div class="section-content"><p>Provide instructions to help users understand how to complete the form and use individual form controls. Indicate any required and optional input, data formats, and other relevant information. When using the <code>min</code> attribute, ensure this minimum requirement is understood by the user. Providing instructions within the <a href="../element/label"><code>&lt;label&gt;</code></a> may be sufficient. If providing instructions outside of labels, which allows more flexible positioning and design, consider using <a href="https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-labelledby"><code>aria-labelledby</code></a> or <a href="https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-describedby"><code>aria-describedby</code></a>.</p></div>
+<h2 id="specifications">Specifications</h2>
+<div class="_table"><table class="standard-table">
+<thead><tr><th scope="col">Specification</th></tr></thead>
+<tbody>
+<tr><td><a href="https://html.spec.whatwg.org/multipage/input.html#the-min-and-max-attributes">HTML Standard <br><small># the-min-and-max-attributes</small></a></td></tr>
+<tr><td><a href="https://html.spec.whatwg.org/multipage/form-elements.html#attr-meter-max">HTML Standard <br><small># attr-meter-max</small></a></td></tr>
+</tbody>
+</table></div>
+<h2 id="browser_compatibility">Browser compatibility</h2>
+<div class="_table"><table>
+<thead>
+<tr id="bct-browser-type">
+<th></th>
+<th colspan="6">Desktop</th>
+<th colspan="6">Mobile</th>
+</tr>
+<tr id="bct-browsers">
+<th></th>
+<th>Chrome</th>
+<th>Edge</th>
+<th>Firefox</th>
+<th>Internet Explorer</th>
+<th>Opera</th>
+<th>Safari</th>
+<th>WebView Android</th>
+<th>Chrome Android</th>
+<th>Firefox for Android</th>
+<th>Opera Android</th>
+<th>Safari on IOS</th>
+<th>Samsung Internet</th>
+</tr>
+</thead>
+<tbody><tr>
+<th><code>min</code></th>
+<td class="bc-supports-yes">6</td>
+<td class="bc-supports-yes">≤18</td>
+<td class="bc-supports-yes">16</td>
+<td class="bc-supports-no">No</td>
+<td class="bc-supports-yes">11</td>
+<td class="bc-supports-yes">6</td>
+<td class="bc-supports-no">No</td>
+<td class="bc-supports-yes">18</td>
+<td class="bc-supports-yes">16</td>
+<td class="bc-supports-yes">11</td>
+<td class="bc-supports-yes">10.3</td>
+<td class="bc-supports-yes">1.0</td>
+</tr></tbody>
+</table></div>
+<div class="_table"><table>
+<thead>
+<tr id="bct-browser-type">
+<th></th>
+<th colspan="6">Desktop</th>
+<th colspan="6">Mobile</th>
+</tr>
+<tr id="bct-browsers">
+<th></th>
+<th>Chrome</th>
+<th>Edge</th>
+<th>Firefox</th>
+<th>Internet Explorer</th>
+<th>Opera</th>
+<th>Safari</th>
+<th>WebView Android</th>
+<th>Chrome Android</th>
+<th>Firefox for Android</th>
+<th>Opera Android</th>
+<th>Safari on IOS</th>
+<th>Samsung Internet</th>
+</tr>
+</thead>
+<tbody><tr>
+<th><code>min</code></th>
+<td class="bc-supports-yes">4</td>
+<td class="bc-supports-yes">12</td>
+<td class="bc-supports-yes">16</td>
+<td class="bc-supports-yes">10</td>
+<td class="bc-supports-yes">≤12.1</td>
+<td class="bc-supports-yes">5</td>
+<td class="bc-supports-yes">≤37</td>
+<td class="bc-supports-yes">18</td>
+<td class="bc-supports-yes">16</td>
+<td class="bc-supports-yes">≤12.1</td>
+<td class="bc-supports-yes">4</td>
+<td class="bc-supports-yes">1.0</td>
+</tr></tbody>
+</table></div>
+<h3 id="html.elements.input.min">html.elements.input.min</h3>
+<p>BCD tables only load in the browser<noscript> with JavaScript enabled. Enable JavaScript to view data.</noscript></p>
+<h3 id="html.elements.meter.min">html.elements.meter.min</h3>
+<p>BCD tables only load in the browser<noscript> with JavaScript enabled. Enable JavaScript to view data.</noscript></p>
+<h2 id="see_also">See also</h2>
+<div class="section-content"><ul> <li><a href="step"><code>step</code></a></li> <li><a href="max"><code>max</code></a></li> <li>other meter attributes: <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/low" class="page-not-created"><code>low</code></a>, <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/high" class="page-not-created"><code>high</code></a>, <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/optimum" class="page-not-created"><code>optimum</code></a>
+</li> <li><a href="../constraint_validation">Constraint validation</a></li> <li><a href="https://developer.mozilla.org/en-US/docs/Learn/Forms/Form_validation">Form validation</a></li> <li><a href="https://developer.mozilla.org/en-US/docs/Web/API/ValidityState/rangeUnderflow"><code>validityState.rangeUnderflow</code></a></li> <li><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/:out-of-range"><code>:out-of-range</code></a></li> <li><a href="../element/input"><code>&lt;input&gt;</code></a></li> <li>
+<a href="../element/input/date">date</a>, <a href="../element/input/month">month</a>, <a href="../element/input/week">week</a>, <a href="../element/input/time">time</a>, <a href="../element/input/datetime-local">datetime-local</a>, <a href="../element/input/number">number</a> and <a href="../element/input/range">range</a> types, and the <a href="../element/meter"><code>&lt;meter&gt;</code></a>
+</li> </ul></div><div class="_attribution">
+  <p class="_attribution-p">
+    &copy; 2005&ndash;2023 MDN contributors.<br>Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.<br>
+    <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/min" class="_attribution-link">https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/min</a>
+  </p>
+</div>