Re: [Ovillo] Dar efecto hover en botón en 3 imágen es

2009-09-10 Por tema mikel blonfu
Según el w3c: Generalmente, los elementos en bloque pueden contener
elementos en línea y a otros elementos en bloque. Generalmente, los
elementos en línea sólo pueden contener datos y a otros elementos en línea.
No dice que no se puedan meter un elemento de bloque (un div por ejemplo)
dentro de otro en línea (un enlace en este caso), pero por norma general no
debería hacerse. Se puede usar perfectamente span con un display:block.
Por otra parte darle display:block a un elemento en línea no lo convierte en
un elemento de bloque, se comporta como tal pero sigue siendo un elemento en
línea a egfectos de estructura del documento.
___
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


[Ovillo] Dar efecto hover en botón en 3 imágen es

2009-09-08 Por tema Rafa Artacho
Buenas tardes:

Me gustaría saber si existe alguna técnica para que teniendo un botón
compuesto por 3 imágenes (izquierda, medio y derecha), se pueda aplicar el
efecto hover al botón completo. Tal y como lo tengo ahora:

.boton-wrapper{
float:right;
margin-top:5px;
}
a.boton-wrapper {
text-decoration:none;
color:#FFF;
}
.boton{
background:#DC002E url(../img/pixel-medio.gif) repeat-x 0 0;
height:16px;
float:left;
width:auto;
padding:5px 10px;
}
.boton-izda{
background:#DC002E url(../img/izquierda.gif) no-repeat 0 0;
height:26px;
width:4px;
float:left;
}
.boton-dcha{
background:#DC002E url(../img/derecha.gif) no-repeat 0 0;
height:26px;
width:4px;
float:left;
}
.boton:hover{
background:#DC002E url(../img/pixel_medioHover.gif) repeat-x 0 0;
}
.boton-izda:hover{
background:#DC002E url(../img/izquierdaHover.gif) no-repeat 0 0;
}
.boton-dcha:hover{
background:#DC002E url(../img/derechaHover.gif) no-repeat 0 0;
}


a href=# class=boton-wrapper
div class=boton-izda/div
div class=botonEntrar/div
div class=boton-dcha/div
/a

El hover se aplica a cada uno de los divs de manera individual, cambiándose
de manera desigual el aspecto de botón.

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


Re: [Ovillo] Dar efecto hover en botón en 3 imágen es

2009-09-08 Por tema Ignacio Ricci
a.boton-wrapper:hover .boton {}a.boton-wrapper:hover .boton-izda {}
a.boton-wrapper:hover .boton-dcha {}

2009/9/8 Rafa Artacho teme...@gmail.com

 Buenas tardes:

 Me gustaría saber si existe alguna técnica para que teniendo un botón
 compuesto por 3 imágenes (izquierda, medio y derecha), se pueda aplicar el
 efecto hover al botón completo. Tal y como lo tengo ahora:

 .boton-wrapper{
 float:right;
 margin-top:5px;
 }
 a.boton-wrapper {
 text-decoration:none;
 color:#FFF;
 }
 .boton{
 background:#DC002E url(../img/pixel-medio.gif) repeat-x 0 0;
 height:16px;
 float:left;
 width:auto;
 padding:5px 10px;
 }
 .boton-izda{
 background:#DC002E url(../img/izquierda.gif) no-repeat 0 0;
 height:26px;
 width:4px;
 float:left;
 }
 .boton-dcha{
 background:#DC002E url(../img/derecha.gif) no-repeat 0 0;
 height:26px;
 width:4px;
 float:left;
 }
 .boton:hover{
 background:#DC002E url(../img/pixel_medioHover.gif) repeat-x 0 0;
 }
 .boton-izda:hover{
 background:#DC002E url(../img/izquierdaHover.gif) no-repeat 0 0;
 }
 .boton-dcha:hover{
 background:#DC002E url(../img/derechaHover.gif) no-repeat 0 0;
 }


a href=# class=boton-wrapper
div class=boton-izda/div
div class=botonEntrar/div
div class=boton-dcha/div
/a

 El hover se aplica a cada uno de los divs de manera individual, cambiándose
 de manera desigual el aspecto de botón.

 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




-- 
↓۝ Ignacio Ricci
www.ignacioricci.com
___
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

Re: [Ovillo] Dar efecto hover en botón en 3 imágen es

2009-09-08 Por tema Andrés gutiérrez
Los links si que pueden albergar bloques poniendo el display:block;

El 8 de septiembre de 2009 16:40, Alvarez Laurnaga, Jose Antonio 
jalva...@softwareag.es escribió:

 No sólo es más complicado.
 El enlace es un elemento en línea y no puede albergar elementos de bloque
 (divs)
 El html de Rafa no validará

  -Mensaje original-
  De: ovillo-boun...@lists.ovillo.org
  [mailto:ovillo-boun...@lists.ovillo.org] En nombre de Andrés
  gutiérrez
  Enviado el: martes, 08 de septiembre de 2009 16:21
  Para: Ovillo, la lista de CSS en castellano
  Asunto: Re: [Ovillo]Dar efecto hover en botón en 3 imágenes
 
  Aunque es complicarse mucho para un boton, yo te propondría esto:
 
  a href=http://www.google.com;
  spangoogle/span
  /a
 
  a{display:block;background:url(path/a/tu/img-derecha.gif)
  no-repeat top left;padding:0 10px 0 0;} a
  span{display:block;background:url(path/a/tu/img-izquierda.gif
  ) no-repeat top left;padding:6px 10px 6px 0;}
 
  a:hover{display:block;background:url(path/a/tu/img-derecha_over.gif)
  no-repeat top left;padding:0 10px 0 0;}
  a:hover
  span{display:block;background:url(path/a/tu/img-izquierda_over.gif)
  no-repeat top left;padding:6px 10px 6px 0;}
 
  Como ves son 4 img 2 para estado normal y 2 para hover. El
  HTML que se genera es más sencillo.
  Tienes que tener en cuenta que las imagenes del span deben
  de ser muy largas
  (ej:250px) así puedes aplicar esto mismo a distintas
  palabras y el botón se adapta.
  Las imagenes del deben de ser en este caso de 10px de ancho
 
 
 
  El 8 de septiembre de 2009 16:10, Ignacio Ricci
  ignacio.ri...@gmail.comescribió:
 
   De nada
  
   2009/9/8 Rafa Artacho teme...@gmail.com
  
Muchas gracias, se ve perfecto.
   
2009/9/8 Ignacio Ricci ignacio.ri...@gmail.com
   
 a.boton-wrapper:hover .boton {}a.boton-wrapper:hover
  .boton-izda
 {} a.boton-wrapper:hover .boton-dcha {}

 2009/9/8 Rafa Artacho teme...@gmail.com

  Buenas tardes:
 
  Me gustaría saber si existe alguna técnica para que
  teniendo un
  botón compuesto por 3 imágenes (izquierda, medio y
  derecha), se
  pueda
   aplicar
 el
  efecto hover al botón completo. Tal y como lo tengo ahora:
 
  .boton-wrapper{
  float:right;
  margin-top:5px;
  }
  a.boton-wrapper {
  text-decoration:none;
  color:#FFF;
  }
  .boton{
  background:#DC002E url(../img/pixel-medio.gif) repeat-x 0 0;
  height:16px; float:left; width:auto; padding:5px 10px; }
  .boton-izda{ background:#DC002E url(../img/izquierda.gif)
  no-repeat 0 0; height:26px; width:4px; float:left; }
  .boton-dcha{ background:#DC002E url(../img/derecha.gif)
  no-repeat 0 0; height:26px; width:4px; float:left; }
  .boton:hover{ background:#DC002E
  url(../img/pixel_medioHover.gif) repeat-x 0 0; }
  .boton-izda:hover{ background:#DC002E
  url(../img/izquierdaHover.gif) no-repeat 0 0; }
  .boton-dcha:hover{ background:#DC002E
  url(../img/derechaHover.gif) no-repeat 0 0; }
 
 
 a href=# class=boton-wrapper
 div class=boton-izda/div
 div class=botonEntrar/div
 div class=boton-dcha/div
 /a
 
  El hover se aplica a cada uno de los divs de manera
  individual,
 cambiándose
  de manera desigual el aspecto de botón.
 
  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
 



 --
 ↓۝ Ignacio Ricci
 www.ignacioricci.com
 ___
 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
   
  
  
  
   --
   ↓۝ Ignacio Ricci
   www.ignacioricci.com
   ___
   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
  
 
 
 
  --
  Experiencia es lo que obtienes, cuando no obtienes lo que quieres.
  -
  
  Caminar sobre el agua y desarrollar software a partir de
  unas 

Re: [Ovillo] Dar efecto hover en botón en 3 imágen es

2009-09-08 Por tema Tamara Forza
Hola,

no escribo mucho a la lista aunque sigo todas la discusiones.

En mi opinión José Antonio tiene razón, lo que se debería hacer es lo
siguiente:


   a href=# class=boton-wrapper
   span class=boton-izda/span
   span class=botonEntrar/span
   span class=boton-dcha/span
   /a

y definir para el span el display:block. Siempre que nos interese la
accesibilidad del sitio web.

Un saludo,
Tamara

2009/9/8 Andrés gutiérrez andresgut...@gmail.com

 Los links si que pueden albergar bloques poniendo el display:block;

 El 8 de septiembre de 2009 16:40, Alvarez Laurnaga, Jose Antonio 
 jalva...@softwareag.es escribió:

  No sólo es más complicado.
  El enlace es un elemento en línea y no puede albergar elementos de bloque
  (divs)
  El html de Rafa no validará
 
   -Mensaje original-
   De: ovillo-boun...@lists.ovillo.org
   [mailto:ovillo-boun...@lists.ovillo.org] En nombre de Andrés
   gutiérrez
   Enviado el: martes, 08 de septiembre de 2009 16:21
   Para: Ovillo, la lista de CSS en castellano
   Asunto: Re: [Ovillo]Dar efecto hover en botón en 3 imágenes
  
   Aunque es complicarse mucho para un boton, yo te propondría esto:
  
   a href=http://www.google.com;
   spangoogle/span
   /a
  
   a{display:block;background:url(path/a/tu/img-derecha.gif)
   no-repeat top left;padding:0 10px 0 0;} a
   span{display:block;background:url(path/a/tu/img-izquierda.gif
   ) no-repeat top left;padding:6px 10px 6px 0;}
  
   a:hover{display:block;background:url(path/a/tu/img-derecha_over.gif)
   no-repeat top left;padding:0 10px 0 0;}
   a:hover
   span{display:block;background:url(path/a/tu/img-izquierda_over.gif)
   no-repeat top left;padding:6px 10px 6px 0;}
  
   Como ves son 4 img 2 para estado normal y 2 para hover. El
   HTML que se genera es más sencillo.
   Tienes que tener en cuenta que las imagenes del span deben
   de ser muy largas
   (ej:250px) así puedes aplicar esto mismo a distintas
   palabras y el botón se adapta.
   Las imagenes del deben de ser en este caso de 10px de ancho
  
  
  
   El 8 de septiembre de 2009 16:10, Ignacio Ricci
   ignacio.ri...@gmail.comescribió:
  
De nada
   
2009/9/8 Rafa Artacho teme...@gmail.com
   
 Muchas gracias, se ve perfecto.

 2009/9/8 Ignacio Ricci ignacio.ri...@gmail.com

  a.boton-wrapper:hover .boton {}a.boton-wrapper:hover
   .boton-izda
  {} a.boton-wrapper:hover .boton-dcha {}
 
  2009/9/8 Rafa Artacho teme...@gmail.com
 
   Buenas tardes:
  
   Me gustaría saber si existe alguna técnica para que
   teniendo un
   botón compuesto por 3 imágenes (izquierda, medio y
   derecha), se
   pueda
aplicar
  el
   efecto hover al botón completo. Tal y como lo tengo ahora:
  
   .boton-wrapper{
   float:right;
   margin-top:5px;
   }
   a.boton-wrapper {
   text-decoration:none;
   color:#FFF;
   }
   .boton{
   background:#DC002E url(../img/pixel-medio.gif) repeat-x 0 0;
   height:16px; float:left; width:auto; padding:5px 10px; }
   .boton-izda{ background:#DC002E url(../img/izquierda.gif)
   no-repeat 0 0; height:26px; width:4px; float:left; }
   .boton-dcha{ background:#DC002E url(../img/derecha.gif)
   no-repeat 0 0; height:26px; width:4px; float:left; }
   .boton:hover{ background:#DC002E
   url(../img/pixel_medioHover.gif) repeat-x 0 0; }
   .boton-izda:hover{ background:#DC002E
   url(../img/izquierdaHover.gif) no-repeat 0 0; }
   .boton-dcha:hover{ background:#DC002E
   url(../img/derechaHover.gif) no-repeat 0 0; }
  
  
  a href=# class=boton-wrapper
  div class=boton-izda/div
  div class=botonEntrar/div
  div class=boton-dcha/div
  /a
  
   El hover se aplica a cada uno de los divs de manera
   individual,
  cambiándose
   de manera desigual el aspecto de botón.
  
   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
  
 
 
 
  --
  ↓۝ Ignacio Ricci
  www.ignacioricci.com
  ___
  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 

Re: [Ovillo] Dar efecto hover en botón en 3 imágen es

2009-09-08 Por tema Ignacio Ricci
Yo respondo la pregunta que hacen a la lista.Me parece horrible la manera de
hacer ese botón, pero bueno, no me pongo en el rol de profesor.
La gente busca una respuesta concreta.

2009/9/8 Nesta Guerrero Pancorbo nguerr...@emergya.es

 El Tuesday 08 September 2009 16:49:36 Tamara Forza escribió:

 como sabréis primero ha preguntado que como se hace tal cosa...

 Ricci le ha dado la respuesta más perfecta, no es accesible porque un a
 tiene
 que ser inline?, eso donde lo pone? el mismo ha dado la respuesta de
 ponerlo
 en bloque y podría validar, poner span en vez de div no funcionaría ya que
 los div se pegan al contenido, si a la class boton-izda le metes una imagen
 de 50px X 50px no le puedes dar ni height ni width, por lo tanto sigo
 viendo
 bien lo de Ricci, y si no pasa accesibilidad pues se cambiará la forma de
 exponer el problema con otra solución.

  Hola,
 
  no escribo mucho a la lista aunque sigo todas la discusiones.
 
  En mi opinión José Antonio tiene razón, lo que se debería hacer es lo
  siguiente:
 
 
 a href=# class=boton-wrapper
 span class=boton-izda/span
 span class=botonEntrar/span
 span class=boton-dcha/span
 /a
 
  y definir para el span el display:block. Siempre que nos interese la
  accesibilidad del sitio web.
 
  Un saludo,
  Tamara
 
  2009/9/8 Andrés gutiérrez andresgut...@gmail.com
 
   Los links si que pueden albergar bloques poniendo el display:block;
  
   El 8 de septiembre de 2009 16:40, Alvarez Laurnaga, Jose Antonio 
  
   jalva...@softwareag.es escribió:
No sólo es más complicado.
El enlace es un elemento en línea y no puede albergar elementos de
bloque (divs)
El html de Rafa no validará
   
 -Mensaje original-
 De: ovillo-boun...@lists.ovillo.org
 [mailto:ovillo-boun...@lists.ovillo.org] En nombre de Andrés
 gutiérrez
 Enviado el: martes, 08 de septiembre de 2009 16:21
 Para: Ovillo, la lista de CSS en castellano
 Asunto: Re: [Ovillo]Dar efecto hover en botón en 3 imágenes

 Aunque es complicarse mucho para un boton, yo te propondría esto:

 a href=http://www.google.com;
 spangoogle/span
 /a

 a{display:block;background:url(path/a/tu/img-derecha.gif)
 no-repeat top left;padding:0 10px 0 0;} a
 span{display:block;background:url(path/a/tu/img-izquierda.gif
 ) no-repeat top left;padding:6px 10px 6px 0;}


 a:hover{display:block;background:url(path/a/tu/img-derecha_over.gif)
 no-repeat top left;padding:0 10px 0 0;}
 a:hover

 span{display:block;background:url(path/a/tu/img-izquierda_over.gif)
 no-repeat top left;padding:6px 10px 6px 0;}

 Como ves son 4 img 2 para estado normal y 2 para hover. El
 HTML que se genera es más sencillo.
 Tienes que tener en cuenta que las imagenes del span deben
 de ser muy largas
 (ej:250px) así puedes aplicar esto mismo a distintas
 palabras y el botón se adapta.
 Las imagenes del deben de ser en este caso de 10px de ancho



 El 8 de septiembre de 2009 16:10, Ignacio Ricci

 ignacio.ri...@gmail.comescribió:
  De nada
 
  2009/9/8 Rafa Artacho teme...@gmail.com
 
   Muchas gracias, se ve perfecto.
  
   2009/9/8 Ignacio Ricci ignacio.ri...@gmail.com
  
a.boton-wrapper:hover .boton {}a.boton-wrapper:hover

 .boton-izda

{} a.boton-wrapper:hover .boton-dcha {}
   
2009/9/8 Rafa Artacho teme...@gmail.com
   
 Buenas tardes:

 Me gustaría saber si existe alguna técnica para que

 teniendo un

 botón compuesto por 3 imágenes (izquierda, medio y

 derecha), se

 pueda
 
  aplicar
 
el
   
 efecto hover al botón completo. Tal y como lo tengo ahora:

 .boton-wrapper{
 float:right;
 margin-top:5px;
 }
 a.boton-wrapper {
 text-decoration:none;
 color:#FFF;
 }
 .boton{
 background:#DC002E url(../img/pixel-medio.gif) repeat-x 0
 0;
 height:16px; float:left; width:auto; padding:5px 10px; }
 .boton-izda{ background:#DC002E url(../img/izquierda.gif)
 no-repeat 0 0; height:26px; width:4px; float:left; }
 .boton-dcha{ background:#DC002E url(../img/derecha.gif)
 no-repeat 0 0; height:26px; width:4px; float:left; }
 .boton:hover{ background:#DC002E
 url(../img/pixel_medioHover.gif) repeat-x 0 0; }
 .boton-izda:hover{ background:#DC002E
 url(../img/izquierdaHover.gif) no-repeat 0 0; }
 .boton-dcha:hover{ background:#DC002E
 url(../img/derechaHover.gif) no-repeat 0 0; }


a href=# class=boton-wrapper
div class=boton-izda/div
  

Re: [Ovillo] Dar efecto hover en botón en 3 imágen es

2009-09-08 Por tema Andrés gutiérrez
No entiendo nada, creo que no he entendido la pregunta inicial. Se trata de
hacer un link con forma de botón o no?

Si es que si. creo que con un a y un span dentro sobra.

El 8 de septiembre de 2009 16:53, Nesta Guerrero Pancorbo 
nguerr...@emergya.es escribió:

 El Tuesday 08 September 2009 16:49:36 Tamara Forza escribió:

 como sabréis primero ha preguntado que como se hace tal cosa...

 Ricci le ha dado la respuesta más perfecta, no es accesible porque un a
 tiene
 que ser inline?, eso donde lo pone? el mismo ha dado la respuesta de
 ponerlo
 en bloque y podría validar, poner span en vez de div no funcionaría ya que
 los div se pegan al contenido, si a la class boton-izda le metes una imagen
 de 50px X 50px no le puedes dar ni height ni width, por lo tanto sigo
 viendo
 bien lo de Ricci, y si no pasa accesibilidad pues se cambiará la forma de
 exponer el problema con otra solución.

  Hola,
 
  no escribo mucho a la lista aunque sigo todas la discusiones.
 
  En mi opinión José Antonio tiene razón, lo que se debería hacer es lo
  siguiente:
 
 
 a href=# class=boton-wrapper
 span class=boton-izda/span
 span class=botonEntrar/span
 span class=boton-dcha/span
 /a
 
  y definir para el span el display:block. Siempre que nos interese la
  accesibilidad del sitio web.
 
  Un saludo,
  Tamara
 
  2009/9/8 Andrés gutiérrez andresgut...@gmail.com
 
   Los links si que pueden albergar bloques poniendo el display:block;
  
   El 8 de septiembre de 2009 16:40, Alvarez Laurnaga, Jose Antonio 
  
   jalva...@softwareag.es escribió:
No sólo es más complicado.
El enlace es un elemento en línea y no puede albergar elementos de
bloque (divs)
El html de Rafa no validará
   
 -Mensaje original-
 De: ovillo-boun...@lists.ovillo.org
 [mailto:ovillo-boun...@lists.ovillo.org] En nombre de Andrés
 gutiérrez
 Enviado el: martes, 08 de septiembre de 2009 16:21
 Para: Ovillo, la lista de CSS en castellano
 Asunto: Re: [Ovillo]Dar efecto hover en botón en 3 imágenes

 Aunque es complicarse mucho para un boton, yo te propondría esto:

 a href=http://www.google.com;
 spangoogle/span
 /a

 a{display:block;background:url(path/a/tu/img-derecha.gif)
 no-repeat top left;padding:0 10px 0 0;} a
 span{display:block;background:url(path/a/tu/img-izquierda.gif
 ) no-repeat top left;padding:6px 10px 6px 0;}


 a:hover{display:block;background:url(path/a/tu/img-derecha_over.gif)
 no-repeat top left;padding:0 10px 0 0;}
 a:hover

 span{display:block;background:url(path/a/tu/img-izquierda_over.gif)
 no-repeat top left;padding:6px 10px 6px 0;}

 Como ves son 4 img 2 para estado normal y 2 para hover. El
 HTML que se genera es más sencillo.
 Tienes que tener en cuenta que las imagenes del span deben
 de ser muy largas
 (ej:250px) así puedes aplicar esto mismo a distintas
 palabras y el botón se adapta.
 Las imagenes del deben de ser en este caso de 10px de ancho



 El 8 de septiembre de 2009 16:10, Ignacio Ricci

 ignacio.ri...@gmail.comescribió:
  De nada
 
  2009/9/8 Rafa Artacho teme...@gmail.com
 
   Muchas gracias, se ve perfecto.
  
   2009/9/8 Ignacio Ricci ignacio.ri...@gmail.com
  
a.boton-wrapper:hover .boton {}a.boton-wrapper:hover

 .boton-izda

{} a.boton-wrapper:hover .boton-dcha {}
   
2009/9/8 Rafa Artacho teme...@gmail.com
   
 Buenas tardes:

 Me gustaría saber si existe alguna técnica para que

 teniendo un

 botón compuesto por 3 imágenes (izquierda, medio y

 derecha), se

 pueda
 
  aplicar
 
el
   
 efecto hover al botón completo. Tal y como lo tengo ahora:

 .boton-wrapper{
 float:right;
 margin-top:5px;
 }
 a.boton-wrapper {
 text-decoration:none;
 color:#FFF;
 }
 .boton{
 background:#DC002E url(../img/pixel-medio.gif) repeat-x 0
 0;
 height:16px; float:left; width:auto; padding:5px 10px; }
 .boton-izda{ background:#DC002E url(../img/izquierda.gif)
 no-repeat 0 0; height:26px; width:4px; float:left; }
 .boton-dcha{ background:#DC002E url(../img/derecha.gif)
 no-repeat 0 0; height:26px; width:4px; float:left; }
 .boton:hover{ background:#DC002E
 url(../img/pixel_medioHover.gif) repeat-x 0 0; }
 .boton-izda:hover{ background:#DC002E
 url(../img/izquierdaHover.gif) no-repeat 0 0; }
 .boton-dcha:hover{ background:#DC002E
 url(../img/derechaHover.gif) no-repeat 0 0; }


a href=# class=boton-wrapper
div class=boton-izda/div
  

Re: [Ovillo] Dar efecto hover en botón en 3 imágen es

2009-09-08 Por tema Alvarez Laurnaga, Jose Antonio

 Yo respondo la pregunta que hacen a la lista.Me parece 
 horrible la manera de hacer ese botón, pero bueno, no me 
 pongo en el rol de profesor.
 La gente busca una respuesta concreta.

Cierto, pero ¿no crees que también busca aprender? 
Si estaba aplicando un enfoque erróneo y todavía está a tiempo de reprogramar 
ese botón le estamos resolviendo el problema y encima habrá aprendido una mejor 
forma de trabajar para futuros proyectos.
___
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


Re: [Ovillo] Dar efecto hover en botón en 3 imágen es

2009-09-08 Por tema Andrés gutiérrez
Por aprender yo...¿Cuál es la forma más correcta de abordar este problema?


El 8 de septiembre de 2009 17:09, Alvarez Laurnaga, Jose Antonio 
jalva...@softwareag.es escribió:


  Yo respondo la pregunta que hacen a la lista.Me parece
  horrible la manera de hacer ese botón, pero bueno, no me
  pongo en el rol de profesor.
  La gente busca una respuesta concreta.

 Cierto, pero ¿no crees que también busca aprender?
 Si estaba aplicando un enfoque erróneo y todavía está a tiempo de
 reprogramar ese botón le estamos resolviendo el problema y encima habrá
 aprendido una mejor forma de trabajar para futuros proyectos.
 ___
 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




-- 
Experiencia es lo que obtienes, cuando no obtienes lo que quieres.
-
Caminar sobre el agua y desarrollar software a partir de unas
especificaciones es fácil. si ambas están congeladas.
Edward V. Berard, ingeniero informático.
___
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


Re: [Ovillo] Dar efecto hover en botón en 3 imágen es

2009-09-08 Por tema Ignacio Ricci
No se, creo que depende del approach que uno tiene para con la lista.
Yo estoy hace casi dos años acá, y el 90% de las preguntas son en busqueda
de algo concreto y el otro 10% son preguntas de buenas pràcticas.


2009/9/8 Alvarez Laurnaga, Jose Antonio jalva...@softwareag.es


  Yo respondo la pregunta que hacen a la lista.Me parece
  horrible la manera de hacer ese botón, pero bueno, no me
  pongo en el rol de profesor.
  La gente busca una respuesta concreta.

 Cierto, pero ¿no crees que también busca aprender?
 Si estaba aplicando un enfoque erróneo y todavía está a tiempo de
 reprogramar ese botón le estamos resolviendo el problema y encima habrá
 aprendido una mejor forma de trabajar para futuros proyectos.
 ___
 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




-- 
↓۝ Ignacio Ricci
www.ignacioricci.com
___
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

Re: [Ovillo] Dar efecto hover en botón en 3 imágen es

2009-09-08 Por tema Ignacio Ricci
De nada

2009/9/8 Rafa Artacho teme...@gmail.com

 Muchas gracias, se ve perfecto.

 2009/9/8 Ignacio Ricci ignacio.ri...@gmail.com

  a.boton-wrapper:hover .boton {}a.boton-wrapper:hover .boton-izda {}
  a.boton-wrapper:hover .boton-dcha {}
 
  2009/9/8 Rafa Artacho teme...@gmail.com
 
   Buenas tardes:
  
   Me gustaría saber si existe alguna técnica para que teniendo un botón
   compuesto por 3 imágenes (izquierda, medio y derecha), se pueda aplicar
  el
   efecto hover al botón completo. Tal y como lo tengo ahora:
  
   .boton-wrapper{
   float:right;
   margin-top:5px;
   }
   a.boton-wrapper {
   text-decoration:none;
   color:#FFF;
   }
   .boton{
   background:#DC002E url(../img/pixel-medio.gif) repeat-x 0 0;
   height:16px;
   float:left;
   width:auto;
   padding:5px 10px;
   }
   .boton-izda{
   background:#DC002E url(../img/izquierda.gif) no-repeat 0 0;
   height:26px;
   width:4px;
   float:left;
   }
   .boton-dcha{
   background:#DC002E url(../img/derecha.gif) no-repeat 0 0;
   height:26px;
   width:4px;
   float:left;
   }
   .boton:hover{
   background:#DC002E url(../img/pixel_medioHover.gif) repeat-x 0 0;
   }
   .boton-izda:hover{
   background:#DC002E url(../img/izquierdaHover.gif) no-repeat 0 0;
   }
   .boton-dcha:hover{
   background:#DC002E url(../img/derechaHover.gif) no-repeat 0 0;
   }
  
  
  a href=# class=boton-wrapper
  div class=boton-izda/div
  div class=botonEntrar/div
  div class=boton-dcha/div
  /a
  
   El hover se aplica a cada uno de los divs de manera individual,
  cambiándose
   de manera desigual el aspecto de botón.
  
   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
  
 
 
 
  --
  ↓۝ Ignacio Ricci
  www.ignacioricci.com
  ___
  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




-- 
↓۝ Ignacio Ricci
www.ignacioricci.com
___
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

Re: [Ovillo] Dar efecto hover en botón en 3 imágen es

2009-09-08 Por tema Ignacio Ricci
Creo que esta solucion esta bastante buena:
http://cssglobe.com/post/1367/creating-and-styling-resizable-buttons

La use un tiempo. Ahora ya no, pero creo que sirve.

2009/9/8 Andrés gutiérrez andresgut...@gmail.com

 Por aprender yo...¿Cuál es la forma más correcta de abordar este problema?


 El 8 de septiembre de 2009 17:09, Alvarez Laurnaga, Jose Antonio 
 jalva...@softwareag.es escribió:

 
   Yo respondo la pregunta que hacen a la lista.Me parece
   horrible la manera de hacer ese botón, pero bueno, no me
   pongo en el rol de profesor.
   La gente busca una respuesta concreta.
 
  Cierto, pero ¿no crees que también busca aprender?
  Si estaba aplicando un enfoque erróneo y todavía está a tiempo de
  reprogramar ese botón le estamos resolviendo el problema y encima habrá
  aprendido una mejor forma de trabajar para futuros proyectos.
  ___
  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
 



 --
 Experiencia es lo que obtienes, cuando no obtienes lo que quieres.

 -
 Caminar sobre el agua y desarrollar software a partir de unas
 especificaciones es fácil. si ambas están congeladas.
 Edward V. Berard, ingeniero informático.
 ___
 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




-- 
↓۝ Ignacio Ricci
www.ignacioricci.com
___
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

Re: [Ovillo] Dar efecto hover en botón en 3 imágen es

2009-09-08 Por tema Andrés gutiérrez
Aunque es complicarse mucho para un boton, yo te propondría esto:

a href=http://www.google.com;
spangoogle/span
/a

a{display:block;background:url(path/a/tu/img-derecha.gif) no-repeat top
left;padding:0 10px 0 0;}
a span{display:block;background:url(path/a/tu/img-izquierda.gif) no-repeat
top left;padding:6px 10px 6px 0;}

a:hover{display:block;background:url(path/a/tu/img-derecha_over.gif)
no-repeat top left;padding:0 10px 0 0;}
a:hover span{display:block;background:url(path/a/tu/img-izquierda_over.gif)
no-repeat top left;padding:6px 10px 6px 0;}

Como ves son 4 img 2 para estado normal y 2 para hover. El HTML que se
genera es más sencillo.
Tienes que tener en cuenta que las imagenes del span deben de ser muy largas
(ej:250px) así puedes aplicar esto mismo a distintas palabras y el botón se
adapta.
Las imagenes del deben de ser en este caso de 10px de ancho



El 8 de septiembre de 2009 16:10, Ignacio Ricci
ignacio.ri...@gmail.comescribió:

 De nada

 2009/9/8 Rafa Artacho teme...@gmail.com

  Muchas gracias, se ve perfecto.
 
  2009/9/8 Ignacio Ricci ignacio.ri...@gmail.com
 
   a.boton-wrapper:hover .boton {}a.boton-wrapper:hover .boton-izda {}
   a.boton-wrapper:hover .boton-dcha {}
  
   2009/9/8 Rafa Artacho teme...@gmail.com
  
Buenas tardes:
   
Me gustaría saber si existe alguna técnica para que teniendo un botón
compuesto por 3 imágenes (izquierda, medio y derecha), se pueda
 aplicar
   el
efecto hover al botón completo. Tal y como lo tengo ahora:
   
.boton-wrapper{
float:right;
margin-top:5px;
}
a.boton-wrapper {
text-decoration:none;
color:#FFF;
}
.boton{
background:#DC002E url(../img/pixel-medio.gif) repeat-x 0 0;
height:16px;
float:left;
width:auto;
padding:5px 10px;
}
.boton-izda{
background:#DC002E url(../img/izquierda.gif) no-repeat 0 0;
height:26px;
width:4px;
float:left;
}
.boton-dcha{
background:#DC002E url(../img/derecha.gif) no-repeat 0 0;
height:26px;
width:4px;
float:left;
}
.boton:hover{
background:#DC002E url(../img/pixel_medioHover.gif) repeat-x 0 0;
}
.boton-izda:hover{
background:#DC002E url(../img/izquierdaHover.gif) no-repeat 0 0;
}
.boton-dcha:hover{
background:#DC002E url(../img/derechaHover.gif) no-repeat 0 0;
}
   
   
   a href=# class=boton-wrapper
   div class=boton-izda/div
   div class=botonEntrar/div
   div class=boton-dcha/div
   /a
   
El hover se aplica a cada uno de los divs de manera individual,
   cambiándose
de manera desigual el aspecto de botón.
   
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
   
  
  
  
   --
   ↓۝ Ignacio Ricci
   www.ignacioricci.com
   ___
   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
 



 --
 ↓۝ Ignacio Ricci
 www.ignacioricci.com
 ___
 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




-- 
Experiencia es lo que obtienes, cuando no obtienes lo que quieres.
-
Caminar sobre el agua y desarrollar software a partir de unas
especificaciones es fácil. si ambas están congeladas.
Edward V. Berard, ingeniero informático.
___
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

Re: [Ovillo] Dar efecto hover en botón en 3 imágen es

2009-09-08 Por tema Alvarez Laurnaga, Jose Antonio
De las dos en discordia la tuya, Andrés. Aunque creo que en el código que has 
enviado hay algún error, seguramente por las prisas. 
Lo digo porque la estoy probando ¿eh?


 -Mensaje original-
 De: ovillo-boun...@lists.ovillo.org 
 [mailto:ovillo-boun...@lists.ovillo.org] En nombre de Andrés 
 gutiérrez
 Enviado el: martes, 08 de septiembre de 2009 17:12
 Para: Ovillo, la lista de CSS en castellano
 Asunto: Re: [Ovillo]Dar efecto hover en botón en 3 imágenes
 
 Por aprender yo...¿Cuál es la forma más correcta de abordar 
 este problema?
 
 
 El 8 de septiembre de 2009 17:09, Alvarez Laurnaga, Jose 
 Antonio  jalva...@softwareag.es escribió:
 
 
   Yo respondo la pregunta que hacen a la lista.Me parece 
 horrible la 
   manera de hacer ese botón, pero bueno, no me pongo en el rol de 
   profesor.
   La gente busca una respuesta concreta.
 
  Cierto, pero ¿no crees que también busca aprender?
  Si estaba aplicando un enfoque erróneo y todavía está a tiempo de 
  reprogramar ese botón le estamos resolviendo el problema y encima 
  habrá aprendido una mejor forma de trabajar para futuros proyectos.
  ___
  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
 
 
 
 
 --
 Experiencia es lo que obtienes, cuando no obtienes lo que quieres.
 -
 
 Caminar sobre el agua y desarrollar software a partir de 
 unas especificaciones es fácil. si ambas están congeladas.
 Edward V. Berard, ingeniero informático.
 ___
 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


Re: [Ovillo] Dar efecto hover en botón en 3 imágen es

2009-09-08 Por tema Andrés gutiérrez
Perdon. La última linea quería decir que los a/a deben de tener imagenes
(en este ejemplo) de 10px de ancho.

El 8 de septiembre de 2009 16:20, Andrés gutiérrez
andresgut...@gmail.comescribió:

 Aunque es complicarse mucho para un boton, yo te propondría esto:

 a href=http://www.google.com;
 spangoogle/span
 /a

 a{display:block;background:url(path/a/tu/img-derecha.gif) no-repeat top
 left;padding:0 10px 0 0;}
 a span{display:block;background:url(path/a/tu/img-izquierda.gif) no-repeat
 top left;padding:6px 10px 6px 0;}

 a:hover{display:block;background:url(path/a/tu/img-derecha_over.gif)
 no-repeat top left;padding:0 10px 0 0;}
 a:hover span{display:block;background:url(path/a/tu/img-izquierda_over.gif)
 no-repeat top left;padding:6px 10px 6px 0;}

 Como ves son 4 img 2 para estado normal y 2 para hover. El HTML que se
 genera es más sencillo.
 Tienes que tener en cuenta que las imagenes del span deben de ser muy
 largas (ej:250px) así puedes aplicar esto mismo a distintas palabras y el
 botón se adapta.
 Las imagenes del deben de ser en este caso de 10px de ancho



 El 8 de septiembre de 2009 16:10, Ignacio Ricci 
 ignacio.ri...@gmail.comescribió:

 De nada

 2009/9/8 Rafa Artacho teme...@gmail.com

  Muchas gracias, se ve perfecto.
 
  2009/9/8 Ignacio Ricci ignacio.ri...@gmail.com
 
   a.boton-wrapper:hover .boton {}a.boton-wrapper:hover .boton-izda {}
   a.boton-wrapper:hover .boton-dcha {}
  
   2009/9/8 Rafa Artacho teme...@gmail.com
  
Buenas tardes:
   
Me gustaría saber si existe alguna técnica para que teniendo un
 botón
compuesto por 3 imágenes (izquierda, medio y derecha), se pueda
 aplicar
   el
efecto hover al botón completo. Tal y como lo tengo ahora:
   
.boton-wrapper{
float:right;
margin-top:5px;
}
a.boton-wrapper {
text-decoration:none;
color:#FFF;
}
.boton{
background:#DC002E url(../img/pixel-medio.gif) repeat-x 0 0;
height:16px;
float:left;
width:auto;
padding:5px 10px;
}
.boton-izda{
background:#DC002E url(../img/izquierda.gif) no-repeat 0 0;
height:26px;
width:4px;
float:left;
}
.boton-dcha{
background:#DC002E url(../img/derecha.gif) no-repeat 0 0;
height:26px;
width:4px;
float:left;
}
.boton:hover{
background:#DC002E url(../img/pixel_medioHover.gif) repeat-x 0 0;
}
.boton-izda:hover{
background:#DC002E url(../img/izquierdaHover.gif) no-repeat 0 0;
}
.boton-dcha:hover{
background:#DC002E url(../img/derechaHover.gif) no-repeat 0 0;
}
   
   
   a href=# class=boton-wrapper
   div class=boton-izda/div
   div class=botonEntrar/div
   div class=boton-dcha/div
   /a
   
El hover se aplica a cada uno de los divs de manera individual,
   cambiándose
de manera desigual el aspecto de botón.
   
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
   
  
  
  
   --
   ↓۝ Ignacio Ricci
   www.ignacioricci.com
   ___
   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
 



 --
 ↓۝ Ignacio Ricci
 www.ignacioricci.com
 ___
 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




 --
 Experiencia es lo que obtienes, cuando no obtienes lo que quieres.

 -
 Caminar sobre el agua y desarrollar software a partir de unas
 especificaciones es fácil. si ambas están congeladas.
 Edward V. Berard, ingeniero informático.




-- 
Experiencia es lo que obtienes, cuando no obtienes lo que quieres.
-
Caminar sobre el agua y desarrollar software a partir de unas
especificaciones es fácil. si ambas están congeladas.
Edward V. Berard, ingeniero informático.
___
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 

Re: [Ovillo] Dar efecto hover en botón en 3 imágen es

2009-09-08 Por tema Rafa Artacho
Muchas gracias, se ve perfecto.

2009/9/8 Ignacio Ricci ignacio.ri...@gmail.com

 a.boton-wrapper:hover .boton {}a.boton-wrapper:hover .boton-izda {}
 a.boton-wrapper:hover .boton-dcha {}

 2009/9/8 Rafa Artacho teme...@gmail.com

  Buenas tardes:
 
  Me gustaría saber si existe alguna técnica para que teniendo un botón
  compuesto por 3 imágenes (izquierda, medio y derecha), se pueda aplicar
 el
  efecto hover al botón completo. Tal y como lo tengo ahora:
 
  .boton-wrapper{
  float:right;
  margin-top:5px;
  }
  a.boton-wrapper {
  text-decoration:none;
  color:#FFF;
  }
  .boton{
  background:#DC002E url(../img/pixel-medio.gif) repeat-x 0 0;
  height:16px;
  float:left;
  width:auto;
  padding:5px 10px;
  }
  .boton-izda{
  background:#DC002E url(../img/izquierda.gif) no-repeat 0 0;
  height:26px;
  width:4px;
  float:left;
  }
  .boton-dcha{
  background:#DC002E url(../img/derecha.gif) no-repeat 0 0;
  height:26px;
  width:4px;
  float:left;
  }
  .boton:hover{
  background:#DC002E url(../img/pixel_medioHover.gif) repeat-x 0 0;
  }
  .boton-izda:hover{
  background:#DC002E url(../img/izquierdaHover.gif) no-repeat 0 0;
  }
  .boton-dcha:hover{
  background:#DC002E url(../img/derechaHover.gif) no-repeat 0 0;
  }
 
 
 a href=# class=boton-wrapper
 div class=boton-izda/div
 div class=botonEntrar/div
 div class=boton-dcha/div
 /a
 
  El hover se aplica a cada uno de los divs de manera individual,
 cambiándose
  de manera desigual el aspecto de botón.
 
  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
 



 --
 ↓۝ Ignacio Ricci
 www.ignacioricci.com
 ___
 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

Re: [Ovillo] Dar efecto hover en botón en 3 imágen es

2009-09-08 Por tema Andrés gutiérrez
Creo que la que has puesto [1] , es la mia (que no es mía) pero con
buttom-span-em.

¿Alguna más? O esperamos a css3, ie version ¿? y los borders redondeados y
esas cosas bonitas que estan por venir :D

[1] http://cssglobe.com/post/1367/creating-and-styling-resizable-buttons
El 8 de septiembre de 2009 17:14, Ignacio Ricci
ignacio.ri...@gmail.comescribió:

 Creo que esta solucion esta bastante buena:
 http://cssglobe.com/post/1367/creating-and-styling-resizable-buttons

 La use un tiempo. Ahora ya no, pero creo que sirve.

 2009/9/8 Andrés gutiérrez andresgut...@gmail.com

  Por aprender yo...¿Cuál es la forma más correcta de abordar este
 problema?
 
 
  El 8 de septiembre de 2009 17:09, Alvarez Laurnaga, Jose Antonio 
  jalva...@softwareag.es escribió:
 
  
Yo respondo la pregunta que hacen a la lista.Me parece
horrible la manera de hacer ese botón, pero bueno, no me
pongo en el rol de profesor.
La gente busca una respuesta concreta.
  
   Cierto, pero ¿no crees que también busca aprender?
   Si estaba aplicando un enfoque erróneo y todavía está a tiempo de
   reprogramar ese botón le estamos resolviendo el problema y encima habrá
   aprendido una mejor forma de trabajar para futuros proyectos.
   ___
   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
  
 
 
 
  --
  Experiencia es lo que obtienes, cuando no obtienes lo que quieres.
 
 
 -
  Caminar sobre el agua y desarrollar software a partir de unas
  especificaciones es fácil. si ambas están congeladas.
  Edward V. Berard, ingeniero informático.
  ___
  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
 



 --
 ↓۝ Ignacio Ricci
 www.ignacioricci.com
 ___
 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




-- 
Experiencia es lo que obtienes, cuando no obtienes lo que quieres.
-
Caminar sobre el agua y desarrollar software a partir de unas
especificaciones es fácil. si ambas están congeladas.
Edward V. Berard, ingeniero informático.
___
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