Foros del Web » Creando para Internet » CSS »

Pregunta chorra del día, fondo de celda

Estas en el tema de Pregunta chorra del día, fondo de celda en el foro de CSS en Foros del Web. Tengo un menú horizontal, mi intención es que al pasar el ratón por encima del texto, el fondo de la celda cambie de color, pero ...
  #1 (permalink)  
Antiguo 23/02/2007, 06:15
 
Fecha de Ingreso: noviembre-2006
Mensajes: 68
Antigüedad: 11 años, 1 mes
Puntos: 0
Pregunta chorra del día, fondo de celda

Tengo un menú horizontal, mi intención es que al pasar el ratón por encima del texto, el fondo de la celda cambie de color, pero por ahora solo consigo que me cambie el fondo del link y no de la celda.

Código HTML:
.menu a { font-size: 12px; font-weight: bold; color: #FFFFFF; background-color: #B30208; text-decoration: none;}
.menu a:hover { font-size: 12px; font-weight: bold; color: #FFFFFF; background-color: #E80000; text-decoration: none;}
  #2 (permalink)  
Antiguo 23/02/2007, 06:19
Avatar de JavierB
Colaborador
 
Fecha de Ingreso: febrero-2002
Ubicación: Madrid
Mensajes: 25.052
Antigüedad: 15 años, 10 meses
Puntos: 771
Re: Pregunta chorra del día, fondo de celda

Hola 1pere3

Añade en .menu a

width:100%; display:block;

Saludos,
  #3 (permalink)  
Antiguo 23/02/2007, 07:05
 
Fecha de Ingreso: noviembre-2006
Mensajes: 68
Antigüedad: 11 años, 1 mes
Puntos: 0
Re: Pregunta chorra del día, fondo de celda

Tks Javier, además he añadido
Cita:
height: 100%;
porque me fallaba la altura al tener una imagen al lado del menú.

Me sigue fallando algo, el problema es que el texto no hay forma de alinearlo en el centro. No me funciona el valign="middle" en la tr o td ni nada en el CSS externo.

Copio el código actual del CSS.

Código HTML:
.menu a {font-family: arial,verdana; font-size: 12px; font-weight: bold; color: #FFFFFF; background-color: #B30208; text-decoration: none; width:100%; height:100%; display:block; text-transform: uppercase;}
.menu a:hover { font-family: arial,verdana;	font-size: 12px; font-weight: bold;	color: #FFFFFF;	background-color: #E80000; text-decoration: none; width:100%; height:24px; display:block; text-transform: uppercase;}
  #4 (permalink)  
Antiguo 23/02/2007, 10:30
 
Fecha de Ingreso: febrero-2007
Mensajes: 53
Antigüedad: 10 años, 9 meses
Puntos: 1
Re: Pregunta chorra del día, fondo de celda

podrias mostrar que hay en tu HTML para hacerse una mejor idea de lo que buscas por favor?
  #5 (permalink)  
Antiguo 24/02/2007, 02:54
 
Fecha de Ingreso: noviembre-2006
Mensajes: 68
Antigüedad: 11 años, 1 mes
Puntos: 0
Re: Pregunta chorra del día, fondo de celda

Axterixv, gracias por tu interés. Este es el HTML de la tabla.

Código HTML:
<table width="100%" cellspacing="0" cellpadding="0">
		<tr>
			<td width="319"><img src="images/actualidad-menu.jpg" alt="Cabecera"></td>
			<td class="menu"><a href="index.php">portada</a></td>
			<td width="80px">
			<script type="text/javascript" language="JavaScript1.2">
<!--
stm_bm(["menu3b0f",720,"","blank.gif",0,"","",1,0,250,0,500,1,0,0,"","",0,0,1,2,"default","hand",""],this);
stm_bp("p0",[1,4,0,0,0,0,0,0,100,"",-2,"",-2,50,0,0,"#999999","transparent","",2,0,0,"#000000"]);
stm_ai("p0i0",[0,"NOTICIAS","","",-1,-1,0,"","_self","","","","",0,0,0,"","",0,0,0,1,1,"#B30208",0,"#F23134",0,"","",3,3,0,0,"#FFFFF7","#000000","#FFFFFF","#FFFFFF","bold 12px Arial","bold 12px Arial",0,0],80,24);
stm_bpx("p1","p0",[1,4,0,0,0,0,0,0,100,"progid:DXImageTransform.Microsoft.Wipe(GradientSize=1.0,wipeStyle=1,motion=forward,enabled=0,Duration=0.60)",5,"",-2,50,0,0,"#999999","transparent","",3]);
stm_aix("p1i0","p0i0",[0,"    ENTREVISTAS ","","",-1,-1,0,"","_self","","","","",0,0,0,"","",0,0,0,0],0,22);
stm_aix("p1i1","p1i0",[0,"    CRÓNICAS "],0,22);
stm_aix("p1i2","p1i0",[0,"    PREVIAS "],0,22);
stm_aix("p1i3","p1i0",[0,"    RESULTADOS "],0,22);
stm_aix("p1i4","p1i0",[0,"    CLASIFICACIONES "],0,22);
stm_aix("p1i5","p1i0",[0,"    OTROS "],0,22);
stm_ep();
stm_ep();
stm_sc(1,["transparent","transparent","","",3,3,0,0,"#FFFFF7","#000000","","",7,9,0,"","",7,9,0,0,200]);
stm_em();
//-->
</script>
			</td>
			<td class="menu"><a href="cronica.php">envía tu crónica</a></td>
			<td class="menu"><a href="partidos.php">partidos</a></td>
			<td class="menu"><a href="enlaces.php">enlaces</a></td>
		</tr>
	</table> 

Última edición por 1pere3; 27/02/2007 a las 02:40
  #6 (permalink)  
Antiguo 26/02/2007, 03:09
 
Fecha de Ingreso: noviembre-2006
Mensajes: 68
Antigüedad: 11 años, 1 mes
Puntos: 0
Re: Pregunta chorra del día, fondo de celda

alguien me hecha un cable?
  #7 (permalink)  
Antiguo 26/02/2007, 04:05
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Re: Pregunta chorra del día, fondo de celda

Como el selector "a" lo tienes con un height de 100%, y el "a:hover" de 24px, te produce ese efecto. Debes añadir al selector "a" un line-height: 24px;, de esta manera:

.menu a { font-family: arial,verdana;
font-size: 12px;
font-weight: bold;
color: rgb(255, 255, 255);
background-color: rgb(179, 2, 8);
text-decoration: none;
width: 100%;
height: 100%;
display: block;
text-transform: uppercase;
line-height: 24px;
}

.menu a:hover { background-color: rgb(232, 0, 0);
height: 24px;
}

Además, te sobran un montón de reglas del hover. Te las quitado. Prueba a ver qué tal.

Mikel.
  #8 (permalink)  
Antiguo 26/02/2007, 09:09
 
Fecha de Ingreso: noviembre-2006
Mensajes: 68
Antigüedad: 11 años, 1 mes
Puntos: 0
Re: Pregunta chorra del día, fondo de celda

Perfecto, muchas gracias.
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 02:47.