el fallo del menú

Hola :D

Antes que nada quiero felicitarlos! Esto que han creado es magnífico, personalmente nunca pensé que crearía nada por mi cuenta, aún no salgo de mi asombro de todo lo que aquí he aprendido, realmente es fabuloso!!

Aún así me he trabado con un problema, y no quiero avanzar mucho más porque luego sé que voy a complicar más las cosas..

No quise molestar con las preguntas pero por mas que busque por todas partes no encontre mi problema. Es el suiguiente: Al tratar de reparar el fallo del menu (cuando le damos un estilo, en la 2da lección) y crear uno propio del "contenido", éste último no toma el ancho que le indico. Sí traté con medidas exageradas, y la medida que adopta es siempre la misma, también pude quitar las propiedades y regresarlo a la estructura anterior pero no puedo darle un ancho de 800px.. el contenido me queda apenas el doble de ancho que el menú..

Desde ya muchas gracias,
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
<tittle>conoce la mejor banda de Rock</title>
<link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
</head>
<body>
<div id="global">
<div id="cabecera">PAGANDO EL PRECIO NO TIENE PRECIO!</div>
<div id="navegacion">LOS ARTISTAS</div>
<div id="contenido"><div id="menu">
<ul>
  • elemento de la lista 1
  • elemento de la lista 2
  • elemento de la lista 3
    menu
    </div>
    TOKES EN VIVO
    </div>
    <div id="piedepagina">LO QUE SE VIENE</div>
    </div></body>
    </html>


    y aquí la hoja de estilos


    *{margin:0px ; padding:0px ; border:0px}
    body{text-align:center}

    a {color:brown; text-decoration: none ;display: block}
    a:link {}
    a:visited {}
    a:hover {color:red ; text-decoration: underline ;background-color: silver}
    a:active {}

    #global{widht:800px ; margin:4px auto}
    #cabecera {background-color:pink}
    #navegacion {background-color:green}
    #contenido{background-color:orange;widht:800px ;float:left}
    #menu {background-color:yellow;widht:150px;float:left ;text-align:left}
    #menu li{list-style:none; margin: 4px 0px 4px 6px}
    #piedepagina{background-color:red}


    gracias otra vez.. gaby.
  • gaby escribió:Hola :D

    Antes que nada quiero felicitarlos! Esto que han creado es magnífico, personalmente nunca pensé que crearía nada por mi cuenta, aún no salgo de mi asombro de todo lo que aquí he aprendido, realmente es fabuloso!!

    Aún así me he trabado con un problema, y no quiero avanzar mucho más porque luego sé que voy a complicar más las cosas..

    No quise molestar con las preguntas pero por mas que busque por todas partes no encontre mi problema. Es el suiguiente: Al tratar de reparar el fallo del menu (cuando le damos un estilo, en la 2da lección) y crear uno propio del "contenido", éste último no toma el ancho que le indico. Sí traté con medidas exageradas, y la medida que adopta es siempre la misma, también pude quitar las propiedades y regresarlo a la estructura anterior pero no puedo darle un ancho de 800px.. el contenido me queda apenas el doble de ancho que el menú..

    Desde ya muchas gracias,
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

    <html>
    <head>
    <tittle>conoce la mejor banda de Rock</title>
    <link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
    </head>
    <body>
    <div id="global">
    <div id="cabecera">PAGANDO EL PRECIO NO TIENE PRECIO!</div>
    <div id="navegacion">LOS ARTISTAS</div>
    <div id="contenido"><div id="menu">
    <ul>
  • elemento de la lista 1
  • elemento de la lista 2
  • elemento de la lista 3
    menu
    </div>
    TOKES EN VIVO
    </div>
    <div id="piedepagina">LO QUE SE VIENE</div>
    </div></body>
    </html>


    y aquí la hoja de estilos


    *{margin:0px ; padding:0px ; border:0px}
    body{text-align:center}

    a {color:brown; text-decoration: none ;display: block}
    a:link {}
    a:visited {}
    a:hover {color:red ; text-decoration: underline ;background-color: silver}
    a:active {}

    #global{widht:800px ; margin:4px auto}
    #cabecera {background-color:pink}
    #navegacion {background-color:green}
    #contenido{background-color:orange;widht:800px ;float:left}
    #menu {background-color:yellow;widht:150px;float:left ;text-align:left}
    #menu li{list-style:none; margin: 4px 0px 4px 6px}
    #piedepagina{background-color:red}


    gracias otra vez.. gaby.
  • Hola:
    Si usted se fija, en el curso se ponen unos párrafos para que usted los escriba, eso es debido a que la capa contenido necesita eso, un contenido usted solo ha puesto TOKES EN VIVO , como usted le ha puestto a la capa contenido un float:left, la capa tiende a irse a la izquierda ocupando de ancho lo que mide la capa menu mas lo que usted ha escrito en la capa contenido, si usted escribe unos cuantos párrafos mas o menos largos seguramente verá como la capa coge el ancho esperado.
    Saludos
    Agradecido de los que aprenden enseñando
    Por demás gracias. A veces suelo ver el árbol y no el bosque..

    Problema resuelto. gaby