Foros del Web » Creando para Internet » CSS »

a:hover

Estas en el tema de a:hover en el foro de CSS en Foros del Web. Hola, estoy tratando de crear una barra de navegacion, como la que usa el sitio boagworld.com, pero tengo un problema, quiero que en rollover el ...
  #1 (permalink)  
Antiguo 08/06/2007, 19:53
Avatar de marcelomdsc  
Fecha de Ingreso: junio-2007
Ubicación: Windsor, California.
Mensajes: 706
Antigüedad: 10 años, 6 meses
Puntos: 8
a:hover

Hola, estoy tratando de crear una barra de navegacion, como la que usa el sitio boagworld.com, pero tengo un problema, quiero que en rollover el contenedor cambie de color, y solo he logrado que lo que cambie de color es el link (a tag) pero no el contenedor (li tag)
este es el link a lo que hice...

marcelomontesdeoca.com/forum/nav.html

La unica forma que se de solucionar esto es si cambio los links a display block level elemente, pero esto no me va a servir en este caso porque yo quiero que los link esten uno al lado del otro (horizontalmente).

Gracias.
  #2 (permalink)  
Antiguo 09/06/2007, 01:58
Avatar de asinox  
Fecha de Ingreso: enero-2002
Ubicación: Santo Domingo
Mensajes: 2.712
Antigüedad: 15 años, 10 meses
Puntos: 6
Re: a:hover

trata de probar esto
Código:
a:hover{
  width:100%;
  height:100%;
  background-color:#FFFF00;
}
__________________
www.dataautos.com
  #3 (permalink)  
Antiguo 09/06/2007, 19:30
Avatar de marcelomdsc  
Fecha de Ingreso: junio-2007
Ubicación: Windsor, California.
Mensajes: 706
Antigüedad: 10 años, 6 meses
Puntos: 8
Re: a:hover

gracias...pero no funciono.
  #4 (permalink)  
Antiguo 09/06/2007, 20:52
Avatar de k4k4  
Fecha de Ingreso: junio-2007
Ubicación: Baja California, México
Mensajes: 120
Antigüedad: 10 años, 6 meses
Puntos: 6
Re: a:hover

Hola,

una opción podría ser efectivamente cambiar el display a block de los elementos a y al mismo tiempo flotarlos (también habría que flotar los elementos li).

Sin embargo, viendo tu página me da la impresión de que buscas que el menú este centrado. También se puede pero hay otras cosas más que considerar y agregar, básicamente ver ventajas/desventajas.

Saludos.
  #5 (permalink)  
Antiguo 10/06/2007, 01:36
Avatar de marcelomdsc  
Fecha de Ingreso: junio-2007
Ubicación: Windsor, California.
Mensajes: 706
Antigüedad: 10 años, 6 meses
Puntos: 8
Re: a:hover

si, eso funciona, tambien otra forma de solucionarlo es agregandole padding al a tag, pero si te fijas en el link otra vez, el problema ahora es que hay como un gap, un espacio que queda sin cubrir, a la izquierda de los links, de todos menos el primero.
Y eso si nose como arreglarlo.

alguna sugerencia?
  #6 (permalink)  
Antiguo 10/06/2007, 02:54
Avatar de k4k4  
Fecha de Ingreso: junio-2007
Ubicación: Baja California, México
Mensajes: 120
Antigüedad: 10 años, 6 meses
Puntos: 6
Re: a:hover

Hola,

puedes eliminar el espacio entre los elementos li de tal forma que quede algo como esto:
Código PHP:
<div id="nav">
<
ul>
<
li class="first"><a href="#">Art &ampApplied Graphics</a></li><li><a href="#">Internet Access</a></li><li><a href="#">ESL</a></li><li><a href="#">Word Proccessing</a></li><li><a href="#">Music</a></li><li><a href="#">Practice</a></li></ul>
</
div
Lo único malo que veo con eso, es que no se ve bonito. xD

Saludos.
  #7 (permalink)  
Antiguo 10/06/2007, 03:27
Avatar de marcelomdsc  
Fecha de Ingreso: junio-2007
Ubicación: Windsor, California.
Mensajes: 706
Antigüedad: 10 años, 6 meses
Puntos: 8
Re: a:hover

si eso funciono, gracias.

Aunque no entiendo porque, ya que eso no tendria que importar o si?
  #8 (permalink)  
Antiguo 10/06/2007, 10:54
Avatar de k4k4  
Fecha de Ingreso: junio-2007
Ubicación: Baja California, México
Mensajes: 120
Antigüedad: 10 años, 6 meses
Puntos: 6
Re: a:hover

Lo que sucede es que como declaras a los li tags como elementos "inline" tanto los li como su contenido se consideran como texto y los saltos de línea son transformados a espacios. Ese es el mismo resultado que obtenemos cuando usamos los p tags, por ejemplo:
Código PHP:
<p>
Esta
es
una
prueba
</p
Como el p tiene display:inline por default, el contenido se muestra como "Esta es una prueba".

Saludos.
  #9 (permalink)  
Antiguo 10/06/2007, 13:15
Avatar de marcelomdsc  
Fecha de Ingreso: junio-2007
Ubicación: Windsor, California.
Mensajes: 706
Antigüedad: 10 años, 6 meses
Puntos: 8
Re: a:hover

aaaaaaaaaaaaaaaaaaa claro.
Ahora si todo tiene sentido......GRACIAS!
  #10 (permalink)  
Antiguo 12/06/2007, 12:14
Avatar de marcelomdsc  
Fecha de Ingreso: junio-2007
Ubicación: Windsor, California.
Mensajes: 706
Antigüedad: 10 años, 6 meses
Puntos: 8
Re: a:hover

empesaweb, si precisas mas ayuda podes ir a la pagina que estoy creando en
marcelomontesdeoca.com/mcl y ahi puedes ver im html y css, ya que ahora por fin pude lograr que funcione bien, al menos la navegacion...jaja.
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 16:43.