Skip to main content
La otra respuesta es pésima.
Origen Enlace
Shaz
  • 29.2k
  • 18
  • 40
  • 61

La respuesta aceptada es una mala práctica y una pésima aplicación de las tablas HTML, y no debe ser aplicada en ningún contexto. Aquí la sustentación:

Las tablas de HTML existen para tabular información, no para dar estilo, al pretender «dar estilo» o generar la estructura con tablas, se está dañando toda la semántica del sitio, se complica a futuro las mejoras del mismo, no va a funcionar bien en todos los dispositivos y por último y tal vez lo más importante, se está afectando la accesibilidad (personas con discapacidad). Esto no es nuevo, es una mala práctica desde hace ya varios años, desde la década pasada.


Mi respuesta/solución:

En cuanto a si debes utilizar CSS o no, la respuesta es: Sí, debes usar CSS, HTML no ofrece estilos, y en el fondo cuando no utilizas estilos, los resulta asignando el navegador (estilos predeterminados).

En cuanto a si debes utilizar CSS o no, la respuesta es: Sí, debes usar CSS, HTML no ofrece estilos, y en el fondo cuando no utilizas estilos, los resulta asignando el navegador (estilos predeterminados).

La respuesta aceptada es una mala práctica y una pésima aplicación de las tablas HTML, y no debe ser aplicada en ningún contexto. Aquí la sustentación:

Las tablas de HTML existen para tabular información, no para dar estilo, al pretender «dar estilo» o generar la estructura con tablas, se está dañando toda la semántica del sitio, se complica a futuro las mejoras del mismo, no va a funcionar bien en todos los dispositivos y por último y tal vez lo más importante, se está afectando la accesibilidad (personas con discapacidad). Esto no es nuevo, es una mala práctica desde hace ya varios años, desde la década pasada.


Mi respuesta/solución:

En cuanto a si debes utilizar CSS o no, la respuesta es: Sí, debes usar CSS, HTML no ofrece estilos, y en el fondo cuando no utilizas estilos, los resulta asignando el navegador (estilos predeterminados).

Origen Enlace
Shaz
  • 29.2k
  • 18
  • 40
  • 61

En cuanto a si debes utilizar CSS o no, la respuesta es: Sí, debes usar CSS, HTML no ofrece estilos, y en el fondo cuando no utilizas estilos, los resulta asignando el navegador (estilos predeterminados).

Teniendo en cuenta que dices que no deseas utilizar ningún framework, lo más sencillo podría ser hacer que <label> sea un elemento inline-block y asignarle un ancho fijo. El único «problema» sería el responsive, para lo cual tendrías que aplicar media queries.

label {
  display: inline-block;
  width: 20%;
}
<div name="dinero">
            <div name="monedas">
                <label>Monedas de 1 cent: </label>
                <input id="1" type="number" min="0" value="0" onchange="sumar()">
                    <br>
                    <br>
                <label>Monedas de 2 cents: </label>
                <input id="2" type="number" min="0" value="0" onchange="sumar()">
                    <br>
                    <br>
                <label>Monedas de 5 cents: </label>
                <input id="5" type="number" min="0" value="0" onchange="sumar()">
                    <br>    
                    <br>
                <label>Monedas de 10 cents: </label>
                <input id="10" type="number" min="0" value="0" onchange="sumar()">
                    <br>
                    <br>
                <label>Monedas de 20 cents: </label>
                <input id="20" type="number" min="0" value="0" onchange="sumar()">
                    <br>    
                    <br>
                <label>Monedas de 50 cents: </label>
                <input id="50" type="number" min="0" value="0" onchange="sumar()">
                    <br>    
                    <br>
                <label>Monedas de 1 euro: </label>
                <input id="100" type="number" min="0" value="0" onchange="sumar()">
                    <br>
                    <br>
                <label>Monedas de 2 euros: </label>
                <input id="200" type="number" min="0" value="0" onchange="sumar()">
                    <br>
                    <br>
                <label>Monedas de 30 euros: </label>
                <input id="3000" type="number" min="0" value="0" onchange="sumar()">
                    <br>
            </div>
            <div id="billetes">
                    <br>
                <label>Billetes de 5 euros: </label>
                <input id="500" type="number" min="0" value="0" onchange="sumar()">
                    <br>
                    <br>
                <label>Billetes de 10 euros: </label>
                <input id="1000" type="number" min="0" value="0" onchange="sumar()">
                    <br>
                    <br>
                <label>Billetes de 20 euros: </label>
                <input id="2000" type="number" min="0" value="0" onchange="sumar()">
                    <br>
                    <br>
                <label>Billetes de 50 euros: </label>
                <input id="5000" type="number" min="0" value="0" onchange="sumar()">
                    <br>
                    <br>
                <label>Billetes de 100 euros: </label>
                <input id="10000" type="number" min="0" value="0" onchange="sumar()">
                    <br>
                    <br>
                <label>Billetes de 200 euros: </label>
                <input id="20000" type="number" min="0" value="0" onchange="sumar()">
                    <br>
            </div>
        </div>