Sí, la solución es muy buena (flipo con los trucos que os sabéis) pero no
consigo que salga como quiero. Os pongo el código y me decís. La idea es que
en el <p> haya una línea que sea menor a la del <li>. De hecho, el <ul>
tendría que flotar a la derecha y quedarse todo a la derecha, pero ahora
tampoco lo consigo. Lo pongo sin el float, primero, vamos a solucionar eso y
luego ya vemos.
Muchas gracias, de verdad.
<!DOCTYPE html>
<head>
<title></title>
<style>
* {
margin: 0;
padding: 0;
}
#capa {
width: 400px;
}
ul {
width: 350px;
list-style: none;
}
li:hover p{
border:0;
padding-bottom:1px;
}
li:hover {
background-color: gray;
}
p {
border-bottom: 1px solid gray;
width: 300px;
padding: 5px;
}
</style>
</head>
<body>
<div id="capa">
<ul>
<li><p>prueba</p></li>
<li><p>prueba</p></li>
</ul>
</div>
</body>
</html>
2011/7/1 Nestali Guerrero <nguerr...@emergya.es>
> Efectivamente, simplemente probé lo que Miquel decía y al 100%. todo es por
> el pixel del border, al cual en el hover no se te movería si también
> tuviera
> el border, o el underline.
>
> Marina agrega lo de Miquel y lo tienes solucionado!
>
> Saludos!
>
> El 1 de julio de 2011 19:10, Nestali Guerrero <nguerr...@emergya.es
> >escribió:
>
> > Lo miro y te contesto ok? gracias por el code
> >
> > El 1 de julio de 2011 19:06, Marina Gallardo <marinagalla...@gmail.com
> >escribió:
> >
> > Me interesa para Chrome, el resto me da lo mismo.
> >>
> >> <!DOCTYPE html>
> >> <head>
> >> <title></title>
> >> <style>
> >> li:hover p{border:0}
> >> li:hover {
> >> background-color: blue;
> >> }
> >> p {
> >> border-bottom: 1px solid gray;
> >> }
> >> </style>
> >> </head>
> >> <body>
> >>
> >> <ul>
> >> <li class="active"><p>prueba</p></li>
> >> <li><p>prueba</p></li>
> >> </ul>
> >>
> >> </body>
> >> </html>
> >>
> >>
> >> 2011/7/1 Nestali Guerrero <nguerr...@emergya.es>
> >>
> >> > Nos puedes poner código para verlo y recrearlo?, 1 pixel? jaajaj ya
> >> estamos
> >> > con el pixel extraño? jaajaja, pasanos algo y lo miramos, te digo que
> lo
> >> > sacamos así!
> >> >
> >> > saludos!
> >> >
> >> > El 1 de julio de 2011 18:28, Marina Gallardo <
> marinagalla...@gmail.com
> >> > >escribió:
> >> >
> >> > > No me vale, me da un salto de un píxel... Ya lo probé.
> >> > >
> >> > > 2011/7/1 Miguel Angel <mik_...@hotmail.com>
> >> > >
> >> > > >
> >> > > > Jaja, si.. a veces es una putada.. pero hay que hacerlo como sea o
> >> bien
> >> > > por
> >> > > > falta de conocimientos, o por falta de tiempo, etc..
> >> > > >
> >> > > > Un saludo!
> >> > > >
> >> > > > > Date: Fri, 1 Jul 2011 15:00:30 +0200
> >> > > > > From: nguerr...@emergya.es
> >> > > > > To: ovillo@lists.ovillo.org
> >> > > > > Subject: Re: [Ovillo] Eliminar border-bottom del <p> anterior al
> >> > > > seleccionado
> >> > > > >
> >> > > > > No te preocupes miguel ya que si tiene que utilizar IE6 va a
> >> tener
> >> > que
> >> > > > ser
> >> > > > > por JS, y aparte estas "burradas" parecen típicas cuando hay un
> >> > > problema
> >> > > > y
> >> > > > > nadie ayuda!!!, al final como sea!!! ajajajajaj. Saludos
> >> compañero!
> >> > > > >
> >> > > > > 2011/7/1 Miguel Angel <mik_...@hotmail.com>
> >> > > > >
> >> > > > > >
> >> > > > > > Que bueno! ya avisaba de que era una burrada lo mio xD
> >> > > > > >
> >> > > > > > > Date: Fri, 1 Jul 2011 14:55:54 +0200
> >> > > > > > > From: nguerr...@emergya.es
> >> > > > > > > To: ovillo@lists.ovillo.org
> >> > > > > > > Subject: Re: [Ovillo] Eliminar border-bottom del <p>
> anterior
> >> al
> >> > > > > > seleccionado
> >> > > > > > >
> >> > > > > > > no me seais burros, a ver te pongo ejemplo:
> >> > > > > > >
> >> > > > > > > <ul>
> >> > > > > > > <li class="active"><p class"tengoborder">prueba</p></li>
> >> > > > > > > <li><p class"tengoborder">prueba</p></li>
> >> > > > > > > </ul>
> >> > > > > > >
> >> > > > > > > <style> sería li.active p{border:0}
> >> > > > > > >
> >> > > > > > > para el hover: li:hover p{border:0}
> >> > > > > > >
> >> > > > > > > Ésto parece magia pero funciona por si no lo sabíais, osea
> >> puedes
> >> > > > decir
> >> > > > > > si
> >> > > > > > > haces hover en ahí, quiero que el fondo del body cambie a
> >> rojo,
> >> > > pues
> >> > > > por
> >> > > > > > css
> >> > > > > > > se puede, nada de Javascript,
> >> > > > > > > la única pega es que no funciona en IE6, pero en 7+ sip.
> >> > > > > > >
> >> > > > > > > El 1 de julio de 2011 14:52, Miguel Angel <
> >> mik_...@hotmail.com>
> >> > > > > > escribió:
> >> > > > > > >
> >> > > > > > > >
> >> > > > > > > > Pero cuando dices relativo.. realmente estas diciendo al
> >> > elemento
> >> > > > > > padre?
> >> > > > > > > >
> >> > > > > > > > Es decir, el elemento que estar por encima?
> >> > > > > > > >
> >> > > > > > > > Un saludo!
> >> > > > > > > >
> >> > > > > > > > > Date: Fri, 1 Jul 2011 14:50:42 +0200
> >> > > > > > > > > From: marinagalla...@gmail.com
> >> > > > > > > > > To: ovillo@lists.ovillo.org
> >> > > > > > > > > Subject: Re: [Ovillo] Eliminar border-bottom del <p>
> >> anterior
> >> > > al
> >> > > > > > > > seleccionado
> >> > > > > > > > >
> >> > > > > > > > > Lo suyo es tratar de hacerlo sin javascript, pero si no
> >> hay
> >> > más
> >> > > > > > remedio
> >> > > > > > > > lo
> >> > > > > > > > > haré... De todas formas, no es un elemento padre-hijo,
> es
> >> un
> >> > > > elemento
> >> > > > > > > > > relativo.
> >> > > > > > > > >
> >> > > > > > > > > 2011/7/1 Miguel Angel <mik_...@hotmail.com>
> >> > > > > > > > >
> >> > > > > > > > > >
> >> > > > > > > > > > Alomejor te diho una burrada, pero con javascript,
> >> puedes
> >> > > > acceder a
> >> > > > > > los
> >> > > > > > > > > > elementos padre, hijo.
> >> > > > > > > > > >
> >> > > > > > > > > > Un saludo!
> >> > > > > > > > > >
> >> > > > > > > > > > > Date: Fri, 1 Jul 2011 14:38:06 +0200
> >> > > > > > > > > > > From: marinagalla...@gmail.com
> >> > > > > > > > > > > To: Ovillo@lists.ovillo.org
> >> > > > > > > > > > > Subject: [Ovillo] Eliminar border-bottom del <p>
> >> anterior
> >> > > al
> >> > > > > > > > seleccionado
> >> > > > > > > > > > >
> >> > > > > > > > > > > Muy buenas. Estoy tratando de hacer algo que no sé
> >> cómo
> >> > > > > > solucionar.
> >> > > > > > > > Tengo
> >> > > > > > > > > > un
> >> > > > > > > > > > > <p> dentro de un <li>, el <p> lleva una
> border-bottom
> >> y
> >> > > tiene
> >> > > > una
> >> > > > > > > > anchura
> >> > > > > > > > > > > menor que el <li>. Me interesa que cuando esté
> >> > seleccionado
> >> > > > el
> >> > > > > > li,
> >> > > > > > > > pueda
> >> > > > > > > > > > > borrar el border-bottom del elemento anterior,
> >> ¿alguien
> >> > > sabe
> >> > > > cómo
> >> > > > > > > > podría
> >> > > > > > > > > > > hacerlo? Muchas gracias.
> >> > > > > > > > > > > _______________________________________________
> >> > > > > > > > > > > Lista de distribución Ovillo
> >> > > > > > > > > > > Para escribir a la lista, envia un correo a
> >> > > > > > Ovillo@lists.ovillo.org
> >> > > > > > > > > > > Puedes modificar tus datos o desuscribirte en la
> >> > siguiente
> >> > > > > > dirección:
> >> > > > > > > > > > http://lists.ovillo.org/mailman/listinfo/ovillo
> >> > > > > > > > > >
> >> > > > > > > > > > _______________________________________________
> >> > > > > > > > > > Lista de distribución Ovillo
> >> > > > > > > > > > Para escribir a la lista, envia un correo a
> >> > > > > > Ovillo@lists.ovillo.org
> >> > > > > > > > > > Puedes modificar tus datos o desuscribirte en la
> >> siguiente
> >> > > > > > dirección:
> >> > > > > > > > > > http://lists.ovillo.org/mailman/listinfo/ovillo
> >> > > > > > > > > >
> >> > > > > > > > > _______________________________________________
> >> > > > > > > > > Lista de distribución Ovillo
> >> > > > > > > > > Para escribir a la lista, envia un correo a
> >> > > > Ovillo@lists.ovillo.org
> >> > > > > > > > > Puedes modificar tus datos o desuscribirte en la
> siguiente
> >> > > > dirección:
> >> > > > > > > > http://lists.ovillo.org/mailman/listinfo/ovillo
> >> > > > > > > >
> >> > > > > > > > _______________________________________________
> >> > > > > > > > Lista de distribución Ovillo
> >> > > > > > > > Para escribir a la lista, envia un correo a
> >> > > > Ovillo@lists.ovillo.org
> >> > > > > > > > Puedes modificar tus datos o desuscribirte en la siguiente
> >> > > > dirección:
> >> > > > > > > > http://lists.ovillo.org/mailman/listinfo/ovillo
> >> > > > > > > >
> >> > > > > > > _______________________________________________
> >> > > > > > > Lista de distribución Ovillo
> >> > > > > > > Para escribir a la lista, envia un correo a
> >> > > Ovillo@lists.ovillo.org
> >> > > > > > > Puedes modificar tus datos o desuscribirte en la siguiente
> >> > > dirección:
> >> > > > > > http://lists.ovillo.org/mailman/listinfo/ovillo
> >> > > > > >
> >> > > > > > _______________________________________________
> >> > > > > > Lista de distribución Ovillo
> >> > > > > > Para escribir a la lista, envia un correo a
> >> > Ovillo@lists.ovillo.org
> >> > > > > > Puedes modificar tus datos o desuscribirte en la siguiente
> >> > dirección:
> >> > > > > > http://lists.ovillo.org/mailman/listinfo/ovillo
> >> > > > > >
> >> > > > > _______________________________________________
> >> > > > > Lista de distribución Ovillo
> >> > > > > Para escribir a la lista, envia un correo a
> >> Ovillo@lists.ovillo.org
> >> > > > > Puedes modificar tus datos o desuscribirte en la siguiente
> >> dirección:
> >> > > > http://lists.ovillo.org/mailman/listinfo/ovillo
> >> > > >
> >> > > > _______________________________________________
> >> > > > Lista de distribución Ovillo
> >> > > > Para escribir a la lista, envia un correo a
> Ovillo@lists.ovillo.org
> >> > > > Puedes modificar tus datos o desuscribirte en la siguiente
> >> dirección:
> >> > > > http://lists.ovillo.org/mailman/listinfo/ovillo
> >> > > >
> >> > > _______________________________________________
> >> > > Lista de distribución Ovillo
> >> > > Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
> >> > > Puedes modificar tus datos o desuscribirte en la siguiente
> dirección:
> >> > > http://lists.ovillo.org/mailman/listinfo/ovillo
> >> > >
> >> > _______________________________________________
> >> > Lista de distribución Ovillo
> >> > Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
> >> > Puedes modificar tus datos o desuscribirte en la siguiente dirección:
> >> > http://lists.ovillo.org/mailman/listinfo/ovillo
> >> >
> >> _______________________________________________
> >> Lista de distribución Ovillo
> >> Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
> >> Puedes modificar tus datos o desuscribirte en la siguiente dirección:
> >> http://lists.ovillo.org/mailman/listinfo/ovillo
> >>
> >
> >
> _______________________________________________
> Lista de distribución Ovillo
> Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
> Puedes modificar tus datos o desuscribirte en la siguiente dirección:
> http://lists.ovillo.org/mailman/listinfo/ovillo
>
_______________________________________________
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
