Por alguna razón, cuando establezco valores mínimos y máximos en una entrada como esta:
<p>The placeholder of the second input is cut off (ie input is collapsed) when the input is assigned a min and max value?</p> <input type="number" placeholder="This is my placeholder."> <input type="number" placeholder="This is my placeholder." min="1" max="15">La entrada colapsa en un pequeño espacio:
Me gustaría evitar que esto suceda sin tener que establecer un valor de "ancho" en la entrada. es posible?
¡Gracias!
El navegador está representando el <input type="number" /> al tamaño que se ajuste a su contenido máximo:
<label for="99">Max is 99</label> <input name="99" id="99" type="number" min="1" max="99"> <br/> <label for="99">Max is 999</label> <input name="99" id="99" type="number" min="1" max="999"> <br/> <label for="99">Max is 9999</label> <input name="99" id="99" type="number" min="1" max="9999"> <br/> <label for="99">Max is 99999</label> <input name="99" id="99" type="number" min="1" max="99999"> <br/> <label for="99">Max is 999999</label> <input name="99" id="99" type="number" min="1" max="999999"> Si desea ingresar algún valor de marcador de posición que exceda ese contenido, deberá cambiar su tamaño con CSS; los atributos de size y width no son válidos para el type "number" .
Además, como señala A Haworth en los comentarios , la utilidad del marcador de posición aquí es bastante limitada; de hecho, desafiaría que quizás los marcadores de posición tengan un beneficio bastante limitado en general . Considere que si este texto es lo suficientemente importante para estar en la página, es lo suficientemente importante para mostrarse como parte de la etiqueta, donde siempre está visible y con suficiente contraste para que pueda verse y leerse fácilmente.