Saltar al contenido

Cómo aumentar el área en la que se puede hacer clic de un boton de etiqueta?

Si hallas algún fallo con tu código o trabajo, recuerda probar siempre en un entorno de testing antes aplicar el código al proyecto final.

Solución:

Para aumentar el área de un enlace de texto, puede usar el siguiente css;

a      
   display: inline-block;     
   position: relative;    
   z-index: 1;     
   padding: 2em;     
   margin: -2em; 

  • Pantalla: se requiere bloque en línea para que se puedan configurar los márgenes y el relleno
  • La posición debe ser relativa para que…
  • El índice z se puede usar para hacer que el área en la que se puede hacer clic permanezca encima de cualquier texto que sigue.
  • El relleno aumenta el área en la que se puede hacer clic
  • El margen negativo mantiene el flujo del texto circundante como debería ser (cuidado con los enlaces superpuestos)

Editar:

La respuesta de @ t1m0thy es más elegante que la mía, mejor sigue sus consejos.

Además, bonito enlace propuesto por @aldemarcalazans en los comentarios: https://davidwalsh.name/html5-buttons.


Respuesta original:

Usar cuando necesite un enlace (el a de ancla). Usar