Foros del Web » Creando para Internet » CSS »

¿Problema con el css o la imagen?

Estas en el tema de ¿Problema con el css o la imagen? en el foro de CSS en Foros del Web. Bien, yo quiero crear este menu el cual la sección de discografia contenga los eps y los albumes de la banda... es una web de ...
  #1 (permalink)  
Antiguo 30/01/2011, 20:19
Avatar de DoPeY-BBS  
Fecha de Ingreso: octubre-2005
Ubicación: Santo Domingo, Dominican Republic, Dominican Republic
Mensajes: 574
Antigüedad: 12 años, 1 mes
Puntos: 12
¿Problema con el css o la imagen?

Bien, yo quiero crear este menu el cual la sección de discografia contenga los eps y los albumes de la banda... es una web de una banda de mésica que quiero hacer.
Código HTML:
Ver original
  1. <ul>
  2.         <div id="menu">
  3.         <ul>
  4.             <li class="current_page_item"><a href="#">Inicio</a></li>
  5.             <li><a href="#">Biografia</a></li>
  6.             <li><a href="#">Discografia</a></li>               
  7.              <ul>
  8.                     <li><a href="#">EP`s</a></li>
  9.                 <li><a href="#">Albumes</a></li>
  10.              </ul>
  11.             </li>
  12.             <li><a href="#">Miembros</a></li>
  13.             <li><a href="#">Conciertos</a></li>
  14.             <li><a href="#">Contacto</a></li>
  15.         </ul>
  16.     </div>
  17.     <!-- end #menu -->
Este el css
Código CSS:
Ver original
  1. /* Menu */
  2.  
  3. #menu {
  4.     width: 940px;
  5.     height: 63px;
  6.     margin: 0 auto;
  7.     padding: 0;
  8.     background: url(images/img01.jpg) repeat-x left top;
  9. }
  10.  
  11. #menu ul {
  12.     margin: 0px 0px 0px 10px;
  13.     padding: 12px 0px 0px 0px;
  14.     list-style: none;
  15.     line-height: normal;
  16. }
  17.  
  18. #menu li {
  19.     float: left;
  20. }
  21.  
  22. #menu a {
  23.     display: block;
  24.     height: 26px;
  25.     margin-right: 2px;
  26.     margin-bottom: 10px;
  27.     padding: 10px 20px 0px 20px;
  28.     text-decoration: none;
  29.     text-align: center;
  30.     text-transform: uppercase;
  31.     font-family: Arial, Helvetica, sans-serif;
  32.     font-size: 12px;
  33.     font-weight: bold;
  34.     color: #FFFFFF;
  35.     border: none;
  36. }
  37.  
  38. #menu a:hover, #menu .current_page_item a {
  39.     text-decoration: none;
  40.     color: #FFFFFF;
  41. }
  42.  
  43. #menu .current_page_item a {
  44.     color: #FFFFFF;
  45.     }

Miren la imagen del menu. necesito una ayuda lo mas pronto posible
http://www.freecsstemplates.org/preview/shadowed/

Gracias
__________________
http://www.htmldog.com/HTML, CSS, and JavaScript,

http://tutorialphp.net/
Aprende PHP en 12 capítulos
  #2 (permalink)  
Antiguo 30/01/2011, 20:42
Avatar de sanxuan  
Fecha de Ingreso: enero-2011
Ubicación: Gijón
Mensajes: 671
Antigüedad: 6 años, 11 meses
Puntos: 36
Respuesta: ¿Problema con el css o la imagen?

El código que muestras no pasa la validación del W3C (http://validator.w3.org).
Eso quiere decir que no es correcto, y que no hay seguridad de que se pueda mostrar en el navegador.

Te marco en rojo donde están los errores.
<ul>
<div id="menu">
<ul>
<li class="current_page_item"><a href="#">Inicio</a></li>
<li><a href="#">Biografia</a></li>
<li><a href="#">Discografia</a></li>
<ul>
<li><a href="#">EP`s</a></li>
<li><a href="#">Albumes</a></li>
</ul>
</li>

<li><a href="#">Miembros</a></li>
<li><a href="#">Conciertos</a></li>
<li><a href="#">Contacto</a></li>
</ul>
</div> <!-- end #menu -->

El primer <ul> parece que se haya colado, ya que no tiene etiqueta de cierre.
El segundo bloque que te he marcado debería formar parte de un elemento <li>, pero sólo aparece la etiqueta final. Has de añadir la etiqueta de comienzo.
Prueba a corregir eso y vuelve a validar.
  #3 (permalink)  
Antiguo 30/01/2011, 21:37
Avatar de DoPeY-BBS  
Fecha de Ingreso: octubre-2005
Ubicación: Santo Domingo, Dominican Republic, Dominican Republic
Mensajes: 574
Antigüedad: 12 años, 1 mes
Puntos: 12
Respuesta: ¿Problema con el css o la imagen?

No entiendo lo que dices.. le agrego un <li> despues <ul>

<ul>
<li>
<li><a href="#">EP`s</a></li>
<li><a href="#">Albumes</a></li>
</ul>

Aun asi :(

Gracias por ayudarme...
__________________
http://www.htmldog.com/HTML, CSS, and JavaScript,

http://tutorialphp.net/
Aprende PHP en 12 capítulos
  #4 (permalink)  
Antiguo 31/01/2011, 02:49
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 15 años, 5 meses
Puntos: 361
Respuesta: ¿Problema con el css o la imagen?

Hola:

Compara tu código con este:

Código HTML:
Ver original
  1. <div id="menu">
  2.     <ul>
  3.         <li class="current_page_item"><a href="#">Inicio</a></li>
  4.         <li><a href="#">Biografia</a></li>
  5.         <li><a href="#">Discografia</a>
  6.             <ul>
  7.                 <li><a href="#">EP`s</a></li>
  8.                 <li><a href="#">Albumes</a></li>
  9.             </ul>
  10.         </li>
  11.         <li><a href="#">Miembros</a></li>
  12.         <li><a href="#">Conciertos</a></li>
  13.         <li><a href="#">Contacto</a></li>
  14.     </ul>
  15. </div>

Saludos.

  #5 (permalink)  
Antiguo 31/01/2011, 16:24
Avatar de DoPeY-BBS  
Fecha de Ingreso: octubre-2005
Ubicación: Santo Domingo, Dominican Republic, Dominican Republic
Mensajes: 574
Antigüedad: 12 años, 1 mes
Puntos: 12
Respuesta: ¿Problema con el css o la imagen?

Gracias, ahora esta mas claro pero mira ahora como lo pone



Lo quiero en horizontal

Aparentemente el css esta bien
Código CSS:
Ver original
  1. #menu {
  2.     width: 940px;
  3.     height: 63px;
  4.     margin: 0 auto;
  5.     padding: 0;
  6.     background: url(images/img01.jpg) repeat-x left top;
  7. }
  8.  
  9. #menu ul {
  10.     margin: 0px 0px 0px 10px;
  11.     padding: 12px 0px 0px 0px;
  12.     list-style: none;
  13.     line-height: normal;
  14. }
  15.  
  16. #menu li {
  17.     float: left;
  18. }
  19.  
  20. #menu a {
  21.     display: block;
  22.         width: 99&#37;;
  23.     height: 26px;
  24.     margin-right: 2px;
  25.     margin-bottom: 10px;
  26.     padding: 10px 20px 0px 20px;
  27.     text-decoration: none;
  28.     text-align: center;
  29.     text-transform: uppercase;
  30.     font-family: Arial, Helvetica, sans-serif;
  31.     font-size: 12px;
  32.     font-weight: bold;
  33.     color: #FFFFFF;
  34.     border: none;
  35. }
  36.  
  37. #menu a:hover, #menu .current_page_item a {
  38.     text-decoration: none;
  39.     color: #FFFFFF;
  40. }
  41.  
  42. #menu .current_page_item a {
  43.     color: #FFFFFF;
  44.     }
__________________
http://www.htmldog.com/HTML, CSS, and JavaScript,

http://tutorialphp.net/
Aprende PHP en 12 capítulos
  #6 (permalink)  
Antiguo 01/02/2011, 14:23
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 15 años, 5 meses
Puntos: 361
Respuesta: ¿Problema con el css o la imagen?

Hola:

Échale un vistazo a los ejemplos de menús desplegables de las FAQ's quizá te sirvan de ayuda.

Saludos.


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 05:39.