Menú izquierdo 3 enlaces no me aparece como en el curso.

¡Cordial saludo.

Sin son tan amables, es que el menú, de la izquierda el que tiene los enlaces 1, 2 y 3; me aparece pegado a la izquierda y en el curso aparece con un espacio entre el mismo y el borde de la página. Al menú que me refiero es el de color amarillo y no aparece pegado en cuanto al texto del mismo sino en cuanto al fondito amarillo que distingue ese menú.

Como no he podido pegar la imagen para mostrarsela, les envío lo que he digitado o copiado.

estilo-general.css

* {text-ident:0px;margin:0px; padding:0px; border: 0px}
body {text-align: center}
#global {width:800px; margin:4px auto}
#cabecera {background-color: pink; border-left: black 1px solid ; border-right: black 1px solid ; border-top: black 1px solid}
#navegacion {background-color: gray; border: black 1px solid}
#contenido {background-color: orange; border-left: black 1px solid ; border-right: black 1px solid}

#contenido p {padding: 5px 10px 5px 10px; text-indent: 15px}
#menu {background-color: yellow; width: 150px ; float:left; text-align:left; margin-right:10px}
#menu li { list-style:none; margin: 3px 10px 3px 3px}
#pie {background-color: brown; border: black 1px solid}
a {color: brown ; text-decoration:none ; display: block }
a:link {}
a:visited {}
a:hover {color: red; text-decoration:underline; background-color: silver}
a:active {}
p {text-align: justify}
h1 {font-size: 1.2em; color:blue ; font-weight: bold ; text-decoration: underline ; text-align: center}
h2 {font.size: 1.1em; color:blue ; font-weight: bold ; text-decoration: none ; text-align: center}
#curva-superior { background-image: url(objetos/curva-superior.gif) ; background-repeat: no-repeat }

plantilla.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
<title>Page title</title>
<link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
</head>
<body>
<div id="global">
<div id="curva-superior"></div>
<div id="cabecera">Bienvenidos a mi Web</div>
<div id="navegacion">Barra de Navegación</div>
<div id="contenido">
<div id="menu">
<ul>
  • Enlace 1
  • Enlace 2
  • Enlace 3
    </div>
    <h1>Esta será la zona principal de la web</h1>


    JUAN EDUARDO GONZÁLEZ REYES: nace el 4 de octubre de 1971, hijo de don Juan De la Cruz González y doña Villaldina Reyes. Su padre lo abandonó cuando apenas contaba 3 años de edad.</p>
    <h2>Fue internado en el "Instituto Campestre de Sibaté"</h2>

    donde estudio los primeros años de su vida y de donde fue sacado por perder el segundo año de la eduacación primaria. Posteriormente, su madre lo llevó consigo para que colaborara con la atención de los clientes de un pequeño kiosko de comestibles que atendía doña Villaldina</p>


    La situación de los dos era sumamente precaria, y pronto aparecería un varón de quien la humilde mujer se enamoraría, sin saber que era hombre de mala calaña.</p>
    </div>
    <div id="pie">Este es el pié de página</div>

    </div>
    </body>
    </html>

    ¡Por sus colaboraciones les estoy muy agradecido! :oops: .
  • ¡¡Entre más viejo no te haces más sabio, sólo más lento!!
    Juan Eduardo González R. escribió:¡Cordial saludo.

    Sin son tan amables, es que el menú, de la izquierda el que tiene los enlaces 1, 2 y 3; me aparece pegado a la izquierda y en el curso aparece con un espacio entre el mismo y el borde de la página. Al menú que me refiero es el de color amarillo y no aparece pegado en cuanto al texto del mismo sino en cuanto al fondito amarillo que distingue ese menú.

    Como no he podido pegar la imagen para mostrarsela, les envío lo que he digitado o copiado.

    estilo-general.css

    * {text-ident:0px;margin:0px; padding:0px; border: 0px}
    body {text-align: center}
    #global {width:800px; margin:4px auto}
    #cabecera {background-color: pink; border-left: black 1px solid ; border-right: black 1px solid ; border-top: black 1px solid}
    #navegacion {background-color: gray; border: black 1px solid}
    #contenido {background-color: orange; border-left: black 1px solid ; border-right: black 1px solid}

    #contenido p {padding: 5px 10px 5px 10px; text-indent: 15px}
    #menu {background-color: yellow; width: 150px ; float:left; text-align:left; margin-right:10px}
    #menu li { list-style:none; margin: 3px 10px 3px 3px}
    #pie {background-color: brown; border: black 1px solid}
    a {color: brown ; text-decoration:none ; display: block }
    a:link {}
    a:visited {}
    a:hover {color: red; text-decoration:underline; background-color: silver}
    a:active {}
    p {text-align: justify}
    h1 {font-size: 1.2em; color:blue ; font-weight: bold ; text-decoration: underline ; text-align: center}
    h2 {font.size: 1.1em; color:blue ; font-weight: bold ; text-decoration: none ; text-align: center}
    #curva-superior { background-image: url(objetos/curva-superior.gif) ; background-repeat: no-repeat }

    plantilla.html

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

    <html>
    <head>
    <title>Page title</title>
    <link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
    </head>
    <body>
    <div id="global">
    <div id="curva-superior"></div>
    <div id="cabecera">Bienvenidos a mi Web</div>
    <div id="navegacion">Barra de Navegación</div>
    <div id="contenido">
    <div id="menu">
    <ul>
  • Enlace 1
  • Enlace 2
  • Enlace 3
    </div>
    <h1>Esta será la zona principal de la web</h1>


    JUAN EDUARDO GONZÁLEZ REYES: nace el 4 de octubre de 1971, hijo de don Juan De la Cruz González y doña Villaldina Reyes. Su padre lo abandonó cuando apenas contaba 3 años de edad.</p>
    <h2>Fue internado en el "Instituto Campestre de Sibaté"</h2>

    donde estudio los primeros años de su vida y de donde fue sacado por perder el segundo año de la eduacación primaria. Posteriormente, su madre lo llevó consigo para que colaborara con la atención de los clientes de un pequeño kiosko de comestibles que atendía doña Villaldina</p>


    La situación de los dos era sumamente precaria, y pronto aparecería un varón de quien la humilde mujer se enamoraría, sin saber que era hombre de mala calaña.</p>
    </div>
    <div id="pie">Este es el pié de página</div>

    </div>
    </body>
    </html>

    ¡Por sus colaboraciones les estoy muy agradecido! :oops: .
  • Hola:
    Le sugiero que por ahora en su hoja de estilo en la capa menu donde tiene ese margin-right:10px, póngalo así: (margin:3px 10px 3px 3px), eso hará que esa capa se separe de arriba 3 píxeles, por la derecha diez píxeles del texto que tenga en la capa contenido, por abajo 3 píxeles de el texto que esté en la capa contenido y por la izquierda 3 píxeles del borde de la capa contenido, y en la capa menu li, ponga el margin así: margin:4px 8px 4px 6px, eso hará que la lista de los enlaces que están dentro de la capa menu quede separada de arriba 4 píxeles por la derecha 8 píxeles, por abajo 4 píxeles, y por la izquierda 6 píxeles
    Si puede haga los cambios y nos lo dice.
    Saludos