Foros del Web » Creando para Internet » CSS »

problemas con el menu

Estas en el tema de problemas con el menu en el foro de CSS en Foros del Web. HOla a todos, me acabo de hacer una web www.inkfusion.es , os la pongo para que veais el menu en funcionamiento.. y tngo un problema ...
  #1 (permalink)  
Antiguo 12/05/2011, 04:46
Avatar de inkfusion  
Fecha de Ingreso: febrero-2011
Mensajes: 16
Antigüedad: 6 años, 9 meses
Puntos: 2
problemas con el menu

HOla a todos, me acabo de hacer una web www.inkfusion.es , os la pongo para que veais el menu en funcionamiento..
y tngo un problema con el menu, no consigo que quede marcado (en este caso seria de color amarillo) en las diferentes secciones, he probado con php, con el css, con java...pero nada...con css para mi caso creo que vendria mejor verdad??

este es el codigo:

Código:
<div id="menu">
            
                <ul id="botones">
            
            	<li><a href="index.html"><b>HOME</b></a></li>
                <li><a href="wallpaints.html"><b>WALLPAINT</b></a></li>
                <li><a href="illustration.html"><b>ILLUSTRATION</b></a></li>
                <li><a href="graphicdesign.html"><b>GRAPHIC DESIGN</b></a></li>
                <li><a href="photography.html"><b>PHOTOGRAPHY</b></a></li>
                <li><a href="trunk.html"><b>TRUNK</b></a></li>
</div>
y el css

Código HTML:
        #menu{
	background-color:#FFFFFF;
	width:215px;
	height:300px;
	float:left;
	font-family:Arial, Helvetica, sans-serif;
	}
	
	#botones{
	list-style:none;
	margin:0px;
	padding:9px 0;
	margin-left:10px;
	}
	
	#botones li a {
	display:block;
	width:180px;
	padding:4px 0;
	text-decoration:none;
	text-align:center;
	font-size:15px;
	color:#FFFFFF;
	background-color:#000000;
	margin:7px;
	}

	#botones li a:hover {
	color:#000000;
	background-color:#FFFF00;

	}
gracias de antemano, un saludo

Última edición por inkfusion; 12/05/2011 a las 05:25
  #2 (permalink)  
Antiguo 12/05/2011, 07:28
Avatar de yonaida  
Fecha de Ingreso: marzo-2011
Ubicación: Barcelona
Mensajes: 123
Antigüedad: 6 años, 8 meses
Puntos: 20
Respuesta: problemas con el menu

la forma mas sencilla es aplicar una clase al boton que quieras en cada hoja, al menos asi hago yo, siempre que se pueda.

Código:
       #menu  li.selected
        {color: #FFFF00; }
	
      
                <li class='selected'><a href="index.html"><b>HOME</b></a></li>
                <li><a href="wallpaints.html"><b>WALLPAINT</b></a></li>
                <li><a href="illustration.html"><b>ILLUSTRATION</b></a></li>
                <li><a href="graphicdesign.html"><b>GRAPHIC DESIGN</b></a></li>
                <li><a href="photography.html"><b>PHOTOGRAPHY</b></a></li>
                <li><a href="trunk.html"><b>TRUNK</b></a></li>
le pones la clase selected en cada pagina a la pestaña del menu que corresponda.

salu2
__________________
Everybody Else It's Doing It, So Why Can't We?
  #3 (permalink)  
Antiguo 12/05/2011, 08:32
Avatar de inkfusion  
Fecha de Ingreso: febrero-2011
Mensajes: 16
Antigüedad: 6 años, 9 meses
Puntos: 2
Respuesta: problemas con el menu

De lujo, me has kitado dolores de cabeza...aunque como me lo ponias tu no me funcionaba... al final lo que he exo ha sido darle al body de cada pagina un "id" y acada boton un selected diferente y asi parece ke tira bien. no se si será una buena forma o si hay otras mejores o mas rapidas, pero weno, funciona.

Código HTML:
<body id="home"> 
Código HTML:
<li><a href="index.html" class='selected1'><b>HOME</b></a></li> 
Código HTML:
body#home a.selected1{
background-color:#FFFF00;
color:#000000;}

Gracias yonaida ;) no tenia ni idea de la clase selected! un saludo
  #4 (permalink)  
Antiguo 12/05/2011, 08:35
Avatar de yonaida  
Fecha de Ingreso: marzo-2011
Ubicación: Barcelona
Mensajes: 123
Antigüedad: 6 años, 8 meses
Puntos: 20
Respuesta: problemas con el menu

caray si es verdad me comi esa parte o.O
esto de forear en el trabajo tiene sus complicaciones, pero ya has visto la luz. jejeje
suerte, por cierto muy xula la pagina.
__________________
Everybody Else It's Doing It, So Why Can't We?
  #5 (permalink)  
Antiguo 12/05/2011, 08:41
Avatar de inkfusion  
Fecha de Ingreso: febrero-2011
Mensajes: 16
Antigüedad: 6 años, 9 meses
Puntos: 2
Respuesta: problemas con el menu

si...llevaba toda la mañana probando javascript. php, css...ya ves..cosas de novatillos...y ahora con el selected ese..ya ves en dos min....xd

gracias guapa ;)
  #6 (permalink)  
Antiguo 13/05/2011, 04:39
 
Fecha de Ingreso: abril-2011
Ubicación: barcelona
Mensajes: 6
Antigüedad: 6 años, 7 meses
Puntos: 1
Respuesta: problemas con el menu

He probado esta solucion pero no me funciona completamente.
Aplicada esta solucion en mi pagina index me funciona, pero cuando la aplico a las demas no.
A las otras paginas hago
<body id="home2"> y sucesivamente numeros consecutivos igual que con selected que le doy numeros consecutivos uno por cada pagina.

coloco esto dentro el head de cada pagina
body#home2 a.selected2{
background-color:#FFFF00;
color:#000000;}

en el menu coloco
<li><a href="http://www.forosdelweb.com/f53/cosas/cosas.html" class='selected2'><b>cosas</b></a></li>

podeis indicarme donde cometo el error,para que no me funcione en las paginas que no son el index
gracias por la ayuda
  #7 (permalink)  
Antiguo 13/05/2011, 04:42
 
Fecha de Ingreso: abril-2011
Ubicación: barcelona
Mensajes: 6
Antigüedad: 6 años, 7 meses
Puntos: 1
Respuesta: problemas con el menu

me ha salido mal al copiar la entrada del menu
<li><a href="http://www.forosdelweb.com/f53/cosas/cosas.html" class='selected2'>cosas</a></li>
  #8 (permalink)  
Antiguo 13/05/2011, 04:46
 
Fecha de Ingreso: abril-2011
Ubicación: barcelona
Mensajes: 6
Antigüedad: 6 años, 7 meses
Puntos: 1
Respuesta: problemas con el menu

vuelvo a intentar que me escriba el menu correctamente
<li><a href="http://www.forosdelweb.com/f53/cosas/cosas.html" class='selected2'>cosas</a></li>
  #9 (permalink)  
Antiguo 13/05/2011, 04:56
Avatar de yonaida  
Fecha de Ingreso: marzo-2011
Ubicación: Barcelona
Mensajes: 123
Antigüedad: 6 años, 8 meses
Puntos: 20
Respuesta: problemas con el menu

body#item1 a.selected1, body#item2 a.selected2, body#item3 a.selected3,
body#item4 a.selected4, body#item5 a.selected5, body#item6 a.selected6,
body#item7 a.selected7, body#item8 a.selected8
{
background-color:#FFFF00;
color:#000000;}

obviamente si tienes la pagina item1 tu selected ha de ser selected1 y asi sucesivamente. esto lo tienes que colocar en tu pagina CSS no en el head de cada pagina. suponiendo que la tienes.

Saludos y comenta que tal vas.
__________________
Everybody Else It's Doing It, So Why Can't We?

Etiquetas: Ninguno
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 13:12.