[SOLUCIONADO] Tamaño del enlace de una lista

[mblascog]

Buenas,
Me gustaría conseguir lo siguiente:
Tengo un menú horizontal, con 4 opciones. Cada una de ellas tiene un ancho del 25% y un enlace a otra página.
Me gustaría que el enlace fuera todo el ancho de la opción, y no sólo del texto

Código HTML:

<li><a href=opcion1.html>título</a></li>
 

La opción es bastante más ancha que lo que ocupa la palabra título. Pero el link sólo es sobre título.

Gracias.

[Jeddu]

Hola mblascog.

Te pudiera recomendar usar un <li><a href="opcion1.html" style="padding:25%">título</a></li>

A mi me ha funcionado, espero que también te funcione.

Saludos

[_Ju]

Debes colocar el link como bloque, así puedes darle un ancho/alto

Código HTML:

<li><a href="opcion1.html" style="display: block; width: 100%; height: 100;">título</a></li>
 

[Linton]

Iniciado por mblascog

Me gustaría que el enlace fuera todo el ancho de la opción, y no sólo del texto

Así lo hago yo:

Código HTML:

<a href=opcion1.html><li>título</li></a>
 

[pzin]

Linton semánticamente eso no es muy correcto.

Lo ideal es lo que comenta _Ju. Especificar display: block para el enlace.

[Linton]

¿Por qué no? Funciona perfectamente.

[Zeromm]

Iniciado por Linton

¿Por qué no? Funciona perfectamente.

Si, funcionar funciona perfecto, pero como dice pzin, semanticamente no es la mejor opción.

Si pruebas a ponerlo de esa forma y le pasas el validador del W3C te da error en ese punto y te explica porque es incorrecto

[mblascog]

Muchas gracias a todos.