¿Es posible poner un padding a un elemento inline y que afecte a
todas las líneas que forman el párrafo?. Estoy probando con un padding
sobre un enlace y al aplicarlo sólo afecta a la primera linea metiendo
esta hacia dentro pero dejando el resto en su posición normal quedando
únicamente la primera fila como sangrada hacia el interior.
Se que si pongo el elemento como bloque el padding afecta a todo su
contenido pero suponiendo que estoy en el caso de un enlace que solo se
quiere "iluminar" al pasar sobre su texto el bloque rompería este efecto
haciendo que se iluminase también al entrar en cualquier parte del
bloque (contenga o no texto bajo el cursor... como una celda, no se si
me explico).

Por ejemplo: tengo el siguiente código...

<ul>
<li><a href="..">Texto de la opción 1</li>
<li><a href="..">Texto de la opción 2 que ocupará dos lineas</li>
<li><a href="..">Texto de la opción 3</li>
</ul>

... y quiero que cada enlace subraye las palabras solo al pasar por
encima. Además se quiere que cada <li> tenga un borde de 1px inferior
que llegará a los limites del <ul> y este un marco a su alrededor
también de 1px dando así a cada <li> el aspecto de "celda de
rejilla/tabla". Por último también se quiere que en la parte izquierda
de los textos de los enlaces aparezca, centrado verticalmente con
respecto al texto del enlace, una flecha que además debe estar separada
unos 5px del borde del <ul> (el gráfico de la flecha se usa en más
partes de la página y se quiere no tener que redibujar uno especifico
para este caso que incluya un hueco en su parte izquierda para simular
un padding en la flecha en caso de querer ponerlo en el <li>)

Si os fijais, después de todo esto, para mi sería perfecto poder
poner la flecha dentro del enlace y a este ponerle un margen de 5px. De
este modo podría mantener la flecha separada del borde del <ul> y las
lineas de los <li> no se verían afectadas por este margen pudiendo
llegar hasta el final tocando el borde del <ul> (los paddings no afectan
a los backgrounds o sea que no me valdría ponerlo dentro del <li> y usar
un padding de 5px en vez de tocar el margen)... La cosa es que haciendo
lo del margen en el enlace consigo posicionar la flecha donde quiero
pero el texto queda por encima y si trato de mover todo el texto con un
padding tengo el problema que os comento: sólo la primera linea hace
caso del padding a menos que use un elemento bloque y pierda el efecto
de "iluminación" como se quiere.

Espero atento vuestras respuestas.
Un cordial saludo y gracias por vuestra ayuda.

Jose escribió:
> ¿Es posible poner un padding a un elemento inline y que afecte a
> todas las líneas que forman el párrafo?. Estoy probando con un padding
> sobre un enlace y al aplicarlo sólo afecta a la primera linea metiendo
> esta hacia dentro pero dejando el resto en su posición normal quedando
> únicamente la primera fila como sangrada hacia el interior.
> Se que si pongo el elemento como bloque el padding afecta a todo su
> contenido pero suponiendo que estoy en el caso de un enlace que solo se
> quiere "iluminar" al pasar sobre su texto el bloque rompería este efecto
> haciendo que se iluminase también al entrar en cualquier parte del
> bloque (contenga o no texto bajo el cursor... como una celda, no se si
> me explico).
>
> Por ejemplo: tengo el siguiente código...
>
> <ul>
> <li><a href="..">Texto de la opción 1</li>
> <li><a href="..">Texto de la opción 2 que ocupará dos lineas</li>
> <li><a href="..">Texto de la opción 3</li>
> </ul>
>
> ... y quiero que cada enlace subraye las palabras solo al pasar por
> encima. Además se quiere que cada <li> tenga un borde de 1px inferior
> que llegará a los limites del <ul> y este un marco a su alrededor
> también de 1px dando así a cada <li> el aspecto de "celda de
> rejilla/tabla". Por último también se quiere que en la parte izquierda
> de los textos de los enlaces aparezca, centrado verticalmente con
> respecto al texto del enlace, una flecha que además debe estar separada
> unos 5px del borde del <ul> (el gráfico de la flecha se usa en más
> partes de la página y se quiere no tener que redibujar uno especifico
> para este caso que incluya un hueco en su parte izquierda para simular
> un padding en la flecha en caso de querer ponerlo en el <li>)
>
> Si os fijais, después de todo esto, para mi sería perfecto poder
> poner la flecha dentro del enlace y a este ponerle un margen de 5px. De
> este modo podría mantener la flecha separada del borde del <ul> y las
> lineas de los <li> no se verían afectadas por este margen pudiendo
> llegar hasta el final tocando el borde del <ul> (los paddings no afectan
> a los backgrounds o sea que no me valdría ponerlo dentro del <li> y usar
> un padding de 5px en vez de tocar el margen)... La cosa es que haciendo
> lo del margen en el enlace consigo posicionar la flecha donde quiero
> pero el texto queda por encima y si trato de mover todo el texto con un
> padding tengo el problema que os comento: sólo la primera linea hace
> caso del padding a menos que use un elemento bloque y pierda el efecto
> de "iluminación" como se quiere.
>

No entiendo exactamente lo que quieres hacer (ando un poco espesito)
pero prueba a manejar el "line-height" que es la separación entre líneas
o a introducir un span (dentro o fuera de los enlaces) y aplicarle
margenes o paddings a ver si logras lo que pretendes.

--
Saludos -=stripTM=-

Jose escribió:
> ¿Es posible poner un padding a un elemento inline y que afecte a
> todas las líneas que forman el párrafo?. Estoy probando con un padding
> sobre un enlace y al aplicarlo sólo afecta a la primera linea metiendo
> esta hacia dentro pero dejando el resto en su posición normal quedando
> únicamente la primera fila como sangrada hacia el interior.
> Se que si pongo el elemento como bloque el padding afecta a todo su
> contenido pero suponiendo que estoy en el caso de un enlace que solo se
> quiere "iluminar" al pasar sobre su texto el bloque rompería este efecto
> haciendo que se iluminase también al entrar en cualquier parte del
> bloque (contenga o no texto bajo el cursor... como una celda, no se si
> me explico).
>
> Por ejemplo: tengo el siguiente código...
>
> <ul>
> <li><a href="..">Texto de la opción 1</li>
> <li><a href="..">Texto de la opción 2 que ocupará dos lineas</li>
> <li><a href="..">Texto de la opción 3</li>
> </ul>
>
> ... y quiero que cada enlace subraye las palabras solo al pasar por
> encima. Además se quiere que cada <li> tenga un borde de 1px inferior
> que llegará a los limites del <ul> y este un marco a su alrededor
> también de 1px dando así a cada <li> el aspecto de "celda de
> rejilla/tabla". Por último también se quiere que en la parte izquierda
> de los textos de los enlaces aparezca, centrado verticalmente con
> respecto al texto del enlace, una flecha que además debe estar separada
> unos 5px del borde del <ul> (el gráfico de la flecha se usa en más
> partes de la página y se quiere no tener que redibujar uno especifico
> para este caso que incluya un hueco en su parte izquierda para simular
> un padding en la flecha en caso de querer ponerlo en el <li>)
>
> Si os fijais, después de todo esto, para mi sería perfecto poder
> poner la flecha dentro del enlace y a este ponerle un margen de 5px. De
> este modo podría mantener la flecha separada del borde del <ul> y las
> lineas de los <li> no se verían afectadas por este margen pudiendo
> llegar hasta el final tocando el borde del <ul> (los paddings no afectan
> a los backgrounds o sea que no me valdría ponerlo dentro del <li> y usar
> un padding de 5px en vez de tocar el margen)... La cosa es que haciendo
> lo del margen en el enlace consigo posicionar la flecha donde quiero
> pero el texto queda por encima y si trato de mover todo el texto con un
> padding tengo el problema que os comento: sólo la primera linea hace
> caso del padding a menos que use un elemento bloque y pierda el efecto
> de "iluminación" como se quiere.
>

No entiendo exactamente lo que quieres hacer (ando un poco espesito)
pero prueba a manejar el "line-height" que es la separación entre líneas
o a introducir un span (dentro o fuera de los enlaces) y aplicarle
margenes o paddings a ver si logras lo que pretendes.

--
Saludos -=stripTM=-

Jose escribió:
> ¿Es posible poner un padding a un elemento inline y que afecte a
> todas las líneas que forman el párrafo?. Estoy probando con un padding
> sobre un enlace y al aplicarlo sólo afecta a la primera linea metiendo
> esta hacia dentro pero dejando el resto en su posición normal quedando
> únicamente la primera fila como sangrada hacia el interior.
> Se que si pongo el elemento como bloque el padding afecta a todo su
> contenido pero suponiendo que estoy en el caso de un enlace que solo se
> quiere "iluminar" al pasar sobre su texto el bloque rompería este efecto
> haciendo que se iluminase también al entrar en cualquier parte del
> bloque (contenga o no texto bajo el cursor... como una celda, no se si
> me explico).
>
> Por ejemplo: tengo el siguiente código...
>
> <ul>
> <li><a href="..">Texto de la opción 1</li>
> <li><a href="..">Texto de la opción 2 que ocupará dos lineas</li>
> <li><a href="..">Texto de la opción 3</li>
> </ul>
>
> ... y quiero que cada enlace subraye las palabras solo al pasar por
> encima. Además se quiere que cada <li> tenga un borde de 1px inferior
> que llegará a los limites del <ul> y este un marco a su alrededor
> también de 1px dando así a cada <li> el aspecto de "celda de
> rejilla/tabla". Por último también se quiere que en la parte izquierda
> de los textos de los enlaces aparezca, centrado verticalmente con
> respecto al texto del enlace, una flecha que además debe estar separada
> unos 5px del borde del <ul> (el gráfico de la flecha se usa en más
> partes de la página y se quiere no tener que redibujar uno especifico
> para este caso que incluya un hueco en su parte izquierda para simular
> un padding en la flecha en caso de querer ponerlo en el <li>)
>
> Si os fijais, después de todo esto, para mi sería perfecto poder
> poner la flecha dentro del enlace y a este ponerle un margen de 5px. De
> este modo podría mantener la flecha separada del borde del <ul> y las
> lineas de los <li> no se verían afectadas por este margen pudiendo
> llegar hasta el final tocando el borde del <ul> (los paddings no afectan
> a los backgrounds o sea que no me valdría ponerlo dentro del <li> y usar
> un padding de 5px en vez de tocar el margen)... La cosa es que haciendo
> lo del margen en el enlace consigo posicionar la flecha donde quiero
> pero el texto queda por encima y si trato de mover todo el texto con un
> padding tengo el problema que os comento: sólo la primera linea hace
> caso del padding a menos que use un elemento bloque y pierda el efecto
> de "iluminación" como se quiere.
>

No entiendo exactamente lo que quieres hacer (ando un poco espesito)
pero prueba a manejar el "line-height" que es la separación entre líneas
o a introducir un span (dentro o fuera de los enlaces) y aplicarle
margenes o paddings a ver si logras lo que pretendes.

--
Saludos -=stripTM=-

Jose escribió:
> ¿Es posible poner un padding a un elemento inline y que afecte a
> todas las líneas que forman el párrafo?. Estoy probando con un padding
> sobre un enlace y al aplicarlo sólo afecta a la primera linea metiendo
> esta hacia dentro pero dejando el resto en su posición normal quedando
> únicamente la primera fila como sangrada hacia el interior.
> Se que si pongo el elemento como bloque el padding afecta a todo su
> contenido pero suponiendo que estoy en el caso de un enlace que solo se
> quiere "iluminar" al pasar sobre su texto el bloque rompería este efecto
> haciendo que se iluminase también al entrar en cualquier parte del
> bloque (contenga o no texto bajo el cursor... como una celda, no se si
> me explico).
>
> Por ejemplo: tengo el siguiente código...
>
> <ul>
> <li><a href="..">Texto de la opción 1</li>
> <li><a href="..">Texto de la opción 2 que ocupará dos lineas</li>
> <li><a href="..">Texto de la opción 3</li>
> </ul>
>
> ... y quiero que cada enlace subraye las palabras solo al pasar por
> encima. Además se quiere que cada <li> tenga un borde de 1px inferior
> que llegará a los limites del <ul> y este un marco a su alrededor
> también de 1px dando así a cada <li> el aspecto de "celda de
> rejilla/tabla". Por último también se quiere que en la parte izquierda
> de los textos de los enlaces aparezca, centrado verticalmente con
> respecto al texto del enlace, una flecha que además debe estar separada
> unos 5px del borde del <ul> (el gráfico de la flecha se usa en más
> partes de la página y se quiere no tener que redibujar uno especifico
> para este caso que incluya un hueco en su parte izquierda para simular
> un padding en la flecha en caso de querer ponerlo en el <li>)
>
> Si os fijais, después de todo esto, para mi sería perfecto poder
> poner la flecha dentro del enlace y a este ponerle un margen de 5px. De
> este modo podría mantener la flecha separada del borde del <ul> y las
> lineas de los <li> no se verían afectadas por este margen pudiendo
> llegar hasta el final tocando el borde del <ul> (los paddings no afectan
> a los backgrounds o sea que no me valdría ponerlo dentro del <li> y usar
> un padding de 5px en vez de tocar el margen)... La cosa es que haciendo
> lo del margen en el enlace consigo posicionar la flecha donde quiero
> pero el texto queda por encima y si trato de mover todo el texto con un
> padding tengo el problema que os comento: sólo la primera linea hace
> caso del padding a menos que use un elemento bloque y pierda el efecto
> de "iluminación" como se quiere.
>

No entiendo exactamente lo que quieres hacer (ando un poco espesito)
pero prueba a manejar el "line-height" que es la separación entre líneas
o a introducir un span (dentro o fuera de los enlaces) y aplicarle
margenes o paddings a ver si logras lo que pretendes.

--
Saludos -=stripTM=-

Jose escribió:
> ¿Es posible poner un padding a un elemento inline y que afecte a
> todas las líneas que forman el párrafo?. Estoy probando con un padding
> sobre un enlace y al aplicarlo sólo afecta a la primera linea metiendo
> esta hacia dentro pero dejando el resto en su posición normal quedando
> únicamente la primera fila como sangrada hacia el interior.
> Se que si pongo el elemento como bloque el padding afecta a todo su
> contenido pero suponiendo que estoy en el caso de un enlace que solo se
> quiere "iluminar" al pasar sobre su texto el bloque rompería este efecto
> haciendo que se iluminase también al entrar en cualquier parte del
> bloque (contenga o no texto bajo el cursor... como una celda, no se si
> me explico).
>
> Por ejemplo: tengo el siguiente código...
>
> <ul>
> <li><a href="..">Texto de la opción 1</li>
> <li><a href="..">Texto de la opción 2 que ocupará dos lineas</li>
> <li><a href="..">Texto de la opción 3</li>
> </ul>
>
> ... y quiero que cada enlace subraye las palabras solo al pasar por
> encima. Además se quiere que cada <li> tenga un borde de 1px inferior
> que llegará a los limites del <ul> y este un marco a su alrededor
> también de 1px dando así a cada <li> el aspecto de "celda de
> rejilla/tabla". Por último también se quiere que en la parte izquierda
> de los textos de los enlaces aparezca, centrado verticalmente con
> respecto al texto del enlace, una flecha que además debe estar separada
> unos 5px del borde del <ul> (el gráfico de la flecha se usa en más
> partes de la página y se quiere no tener que redibujar uno especifico
> para este caso que incluya un hueco en su parte izquierda para simular
> un padding en la flecha en caso de querer ponerlo en el <li>)
>
> Si os fijais, después de todo esto, para mi sería perfecto poder
> poner la flecha dentro del enlace y a este ponerle un margen de 5px. De
> este modo podría mantener la flecha separada del borde del <ul> y las
> lineas de los <li> no se verían afectadas por este margen pudiendo
> llegar hasta el final tocando el borde del <ul> (los paddings no afectan
> a los backgrounds o sea que no me valdría ponerlo dentro del <li> y usar
> un padding de 5px en vez de tocar el margen)... La cosa es que haciendo
> lo del margen en el enlace consigo posicionar la flecha donde quiero
> pero el texto queda por encima y si trato de mover todo el texto con un
> padding tengo el problema que os comento: sólo la primera linea hace
> caso del padding a menos que use un elemento bloque y pierda el efecto
> de "iluminación" como se quiere.
>

No entiendo exactamente lo que quieres hacer (ando un poco espesito)
pero prueba a manejar el "line-height" que es la separación entre líneas
o a introducir un span (dentro o fuera de los enlaces) y aplicarle
margenes o paddings a ver si logras lo que pretendes.

--
Saludos -=stripTM=-

Jose escribió:
> ¿Es posible poner un padding a un elemento inline y que afecte a
> todas las líneas que forman el párrafo?. Estoy probando con un padding
> sobre un enlace y al aplicarlo sólo afecta a la primera linea metiendo
> esta hacia dentro pero dejando el resto en su posición normal quedando
> únicamente la primera fila como sangrada hacia el interior.
> Se que si pongo el elemento como bloque el padding afecta a todo su
> contenido pero suponiendo que estoy en el caso de un enlace que solo se
> quiere "iluminar" al pasar sobre su texto el bloque rompería este efecto
> haciendo que se iluminase también al entrar en cualquier parte del
> bloque (contenga o no texto bajo el cursor... como una celda, no se si
> me explico).
>
> Por ejemplo: tengo el siguiente código...
>
> <ul>
> <li><a href="..">Texto de la opción 1</li>
> <li><a href="..">Texto de la opción 2 que ocupará dos lineas</li>
> <li><a href="..">Texto de la opción 3</li>
> </ul>
>
> ... y quiero que cada enlace subraye las palabras solo al pasar por
> encima. Además se quiere que cada <li> tenga un borde de 1px inferior
> que llegará a los limites del <ul> y este un marco a su alrededor
> también de 1px dando así a cada <li> el aspecto de "celda de
> rejilla/tabla". Por último también se quiere que en la parte izquierda
> de los textos de los enlaces aparezca, centrado verticalmente con
> respecto al texto del enlace, una flecha que además debe estar separada
> unos 5px del borde del <ul> (el gráfico de la flecha se usa en más
> partes de la página y se quiere no tener que redibujar uno especifico
> para este caso que incluya un hueco en su parte izquierda para simular
> un padding en la flecha en caso de querer ponerlo en el <li>)
>
> Si os fijais, después de todo esto, para mi sería perfecto poder
> poner la flecha dentro del enlace y a este ponerle un margen de 5px. De
> este modo podría mantener la flecha separada del borde del <ul> y las
> lineas de los <li> no se verían afectadas por este margen pudiendo
> llegar hasta el final tocando el borde del <ul> (los paddings no afectan
> a los backgrounds o sea que no me valdría ponerlo dentro del <li> y usar
> un padding de 5px en vez de tocar el margen)... La cosa es que haciendo
> lo del margen en el enlace consigo posicionar la flecha donde quiero
> pero el texto queda por encima y si trato de mover todo el texto con un
> padding tengo el problema que os comento: sólo la primera linea hace
> caso del padding a menos que use un elemento bloque y pierda el efecto
> de "iluminación" como se quiere.
>

No entiendo exactamente lo que quieres hacer (ando un poco espesito)
pero prueba a manejar el "line-height" que es la separación entre líneas
o a introducir un span (dentro o fuera de los enlaces) y aplicarle
margenes o paddings a ver si logras lo que pretendes.

--
Saludos -=stripTM=-