Foros del Web » Creando para Internet » CSS »

Dos rollover juntos sin salto de línea

Estas en el tema de Dos rollover juntos sin salto de línea en el foro de CSS en Foros del Web. Hola!: Tengo este código para hacer un rollover de imagenes: En el CSS: Código HTML: #rollover span { display:none; } #rollover a.imagen1 { display: block; ...
  #1 (permalink)  
Antiguo 10/04/2006, 19:30
 
Fecha de Ingreso: agosto-2003
Mensajes: 122
Antigüedad: 14 años, 3 meses
Puntos: 0
Dos rollover juntos sin salto de línea

Hola!:

Tengo este código para hacer un rollover de imagenes:

En el CSS:

Código HTML:
#rollover span {
	display:none;
}

#rollover a.imagen1 {
	display: block;
	width: 133px;
	height: 49px;
	background: url(imagen1a.gif);
}

#escuadras a:hover.imagen1 {
	background:url(imagenes/imagen1b.gif) no-repeat;
}
En el XHTML:

Código HTML:
<a class="imagen1" href="#"><span>Rollover</span></a> 
Quiero colocar dos imagenes (imagen1 y imagen2), una junto a otra, pero defino las clases diferentes, y repito el código XHTML detrás de la línea que os he puesto. Pero al tener el display: block, la imagen me salta de línea y yo quiero que me aparezcan juntas :P.

A ver si me podéis ayudar!

Un saludo :)
  #2 (permalink)  
Antiguo 11/04/2006, 01:40
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.544
Antigüedad: 15 años, 8 meses
Puntos: 1262
Hola:

Display block pone un salto de línea, tal como sabes... debes cambiarlo por display: inline;

Saludos
__________________
Por favor:
No hagan preguntas de temas de foros en mensajes privados... no las respondo
  #3 (permalink)  
Antiguo 11/04/2006, 07:10
 
Fecha de Ingreso: agosto-2003
Mensajes: 122
Antigüedad: 14 años, 3 meses
Puntos: 0
Ya ya, pero entonces el rollover no funciona :P...
  #4 (permalink)  
Antiguo 11/04/2006, 08:34
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.544
Antigüedad: 15 años, 8 meses
Puntos: 1262
Cita:
Iniciado por coke_135
Ya ya, pero entonces el rollover no funciona :P...
¿?

Me he perdido...

Saludos
__________________
Por favor:
No hagan preguntas de temas de foros en mensajes privados... no las respondo
  #5 (permalink)  
Antiguo 11/04/2006, 09:11
Avatar de JavierB
Colaborador
 
Fecha de Ingreso: febrero-2002
Ubicación: Madrid
Mensajes: 25.052
Antigüedad: 15 años, 9 meses
Puntos: 771
Hola coke_135 y caricatos

¿Y poniendolo así...?
Código:
#rollover a.imagen1 {
	display: block;
        float:left;
	width: 133px;
	height: 49px;
	background: url(imagen1a.gif);
}
Saludos,
  #6 (permalink)  
Antiguo 11/04/2006, 18:14
 
Fecha de Ingreso: agosto-2003
Mensajes: 122
Antigüedad: 14 años, 3 meses
Puntos: 0
JavierB, ahora queda mas o menos bien, pero en la siguiente línea tengo que poner un clear:both o no sale. Además la capa contenedora no se estira hasta abajo, se queda antes de las imagenes, como si no tuviera nada dentro. No se si me explico, sigo probando y ya digo algo :).

caricatos, me refiero a que si pongo la propiedad diplay:inline, el rollover de imagenes no funciona. Solo funciona con display:block.

Un saludo y gracias a los dos por contestar.
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 11:16.