Retroceder   Foros del Web > Diseño de Sitios web > CSS

Respuesta
 
Herramientas Desplegado
Antiguo 08-jun-2007, 18:53   #1 (permalink)
marcelomdsc está en el buen camino
 
Avatar de marcelomdsc
 
Fecha de Ingreso: junio-2007
Ubicación: Windsor, California.
Mensajes: 656
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.
marcelomdsc está desconectado   Responder Citando
Antiguo 09-jun-2007, 00:58   #2 (permalink)
asinox ha deshabilitado el karma
 
Avatar de asinox
 
Fecha de Ingreso: noviembre-2002
Ubicación: httpdocs
Mensajes: 2.562
Re: a:hover

trata de probar esto
Código:
a:hover{
  width:100%;
  height:100%;
  background-color:#FFFF00;
}
__________________
www.noxmediastudio.com
asinox.wordpress.com
asinox está desconectado   Responder Citando
Antiguo 09-jun-2007, 18:30   #3 (permalink)
marcelomdsc está en el buen camino
 
Avatar de marcelomdsc
 
Fecha de Ingreso: junio-2007
Ubicación: Windsor, California.
Mensajes: 656
Re: a:hover

gracias...pero no funciono.
marcelomdsc está desconectado   Responder Citando
Antiguo 09-jun-2007, 19:52   #4 (permalink)
k4k4 tiene algunos puntos positivos de karma
 
Avatar de k4k4
 
Fecha de Ingreso: junio-2007
Ubicación: Baja California, México
Mensajes: 120
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.
k4k4 está desconectado   Responder Citando
Antiguo 10-jun-2007, 00:36   #5 (permalink)
marcelomdsc está en el buen camino
 
Avatar de marcelomdsc
 
Fecha de Ingreso: junio-2007
Ubicación: Windsor, California.
Mensajes: 656
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?
marcelomdsc está desconectado   Responder Citando
Antiguo 10-jun-2007, 01:54   #6 (permalink)
k4k4 tiene algunos puntos positivos de karma
 
Avatar de k4k4
 
Fecha de Ingreso: junio-2007
Ubicación: Baja California, México
Mensajes: 120
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.
k4k4 está desconectado   Responder Citando
Antiguo 10-jun-2007, 02:27   #7 (permalink)
marcelomdsc está en el buen camino
 
Avatar de marcelomdsc
 
Fecha de Ingreso: junio-2007
Ubicación: Windsor, California.
Mensajes: 656
Re: a:hover

si eso funciono, gracias.

Aunque no entiendo porque, ya que eso no tendria que importar o si?
marcelomdsc está desconectado   Responder Citando
Antiguo 10-jun-2007, 09:54   #8 (permalink)
k4k4 tiene algunos puntos positivos de karma
 
Avatar de k4k4
 
Fecha de Ingreso: junio-2007
Ubicación: Baja California, México
Mensajes: 120
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.
k4k4 está desconectado   Responder Citando
Antiguo 10-jun-2007, 12:15   #9 (permalink)
marcelomdsc está en el buen camino
 
Avatar de marcelomdsc
 
Fecha de Ingreso: junio-2007
Ubicación: Windsor, California.
Mensajes: 656
Re: a:hover

aaaaaaaaaaaaaaaaaaa claro.
Ahora si todo tiene sentido......GRACIAS!
marcelomdsc está desconectado   Responder Citando
Antiguo 12-jun-2007, 11:14   #10 (permalink)
marcelomdsc está en el buen camino
 
Avatar de marcelomdsc
 
Fecha de Ingreso: junio-2007
Ubicación: Windsor, California.
Mensajes: 656
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.
marcelomdsc está desconectado   Responder Citando
Respuesta

No hay votos aún.


Herramientas
Desplegado

Normas de Publicación
No puedes crear nuevos temas
No puedes responder temas
No puedes subir archivos adjuntos
No puedes editar tus mensajes

BB code is Activado
Caritas están Activado
[IMG] está Activado
Código HTML está Desactivado


La Zona horaria es GMT -6. Ahora son las 23:18.


Message Board Statistics

LinkBacks Enabled by vBSEO 3.1.0

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93