Como colocar bordes a la plantilla de nuestra página web

hola y muchas gracias por la informacion tan valiosa que he resivido de ustedes, voy por la tercera leccion y mi duda es la siguiente:
ya aloje la pagina, configure el ftp, subi el index y las carpetas pero desde los bordes en adelante no sucede nada, no salen bordes ni arriba, ni abajo, ni a los lados nada y mi estilo-general.css se ve asi:

estilo-general.css :D

* {text-indent :opx ; margin:0px ; padding: 0px ; border: 0px}
body {text-align: justify}
#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 }
#menu {background-color:yellow; width: 150px ; float:left ; tex:align:left ; margin: 3px 10px 3px 3px }
#menu li {list-style:none ; margin: 4px 0px 4px 6px}
#pie {background-color:brown ; border: black 1px solid }
#curva-superior { background-image: url(objetos/curva-superior.gif) ; background-repeat: no-repeat }
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 {texta-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}

y esta es mi plantilla :D


<!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="navegation">Barra de navegacion</div>
<div id="contenido">
<div id="menu">
<lu>
  • enlace 1
  • enlace 2
  • enlace 3</lu>
    </div>
    <h1>Esta sera la zona principal de la web</h1>


    este es mi segundo parrafo, esta es la primera prueva de la pagina que estoy creando y en poco tiempo quedara espectacular</P>
    <h2>espera aque termine y veras que podras navegar en ella </h2>


    mantente en contacto para que te enteres de lo ultimo de mi pagina</p>


    recuerda que en estos momento estamos en construccion pero dentro de poco estara lista por completo, donde tendras mucha divercion</p>


    todo esto gracias a www.comocrear tu web que he aprendido muchisimo, esperenos dentro de poco tiempo, espero que esten bien y muchisima suerte</p>
    </div>
    <div id="pie">Este es el pie de la pagina</div>
    <body>
    </html>


    De igual forma al hacer Vista previa todo sale a blanco y negro, solo en azul los enlaces 1, 2 y 3, nesecito ayuda para poder segui las lecciones.

    muchisimas gracias, tengo ya como tres dias de estar con ustedes casi todo el dia...

    nitrox
  • l_nitrox escribió:hola y muchas gracias por la informacion tan valiosa que he resivido de ustedes, voy por la tercera leccion y mi duda es la siguiente:
    ya aloje la pagina, configure el ftp, subi el index y las carpetas pero desde los bordes en adelante no sucede nada, no salen bordes ni arriba, ni abajo, ni a los lados nada y mi estilo-general.css se ve asi:

    estilo-general.css :D

    * {text-indent :opx ; margin:0px ; padding: 0px ; border: 0px}
    body {text-align: justify}
    #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 }
    #menu {background-color:yellow; width: 150px ; float:left ; tex:align:left ; margin: 3px 10px 3px 3px }
    #menu li {list-style:none ; margin: 4px 0px 4px 6px}
    #pie {background-color:brown ; border: black 1px solid }
    #curva-superior { background-image: url(objetos/curva-superior.gif) ; background-repeat: no-repeat }
    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 {texta-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}

    y esta es mi plantilla :D


    <!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="navegation">Barra de navegacion</div>
    <div id="contenido">
    <div id="menu">
    <lu>
  • enlace 1
  • enlace 2
  • enlace 3</lu>
    </div>
    <h1>Esta sera la zona principal de la web</h1>


    este es mi segundo parrafo, esta es la primera prueva de la pagina que estoy creando y en poco tiempo quedara espectacular</P>
    <h2>espera aque termine y veras que podras navegar en ella </h2>


    mantente en contacto para que te enteres de lo ultimo de mi pagina</p>


    recuerda que en estos momento estamos en construccion pero dentro de poco estara lista por completo, donde tendras mucha divercion</p>


    todo esto gracias a www.comocrear tu web que he aprendido muchisimo, esperenos dentro de poco tiempo, espero que esten bien y muchisima suerte</p>
    </div>
    <div id="pie">Este es el pie de la pagina</div>
    <body>
    </html>


    De igual forma al hacer Vista previa todo sale a blanco y negro, solo en azul los enlaces 1, 2 y 3, nesecito ayuda para poder segui las lecciones.

    muchisimas gracias, tengo ya como tres dias de estar con ustedes casi todo el dia...

    nitrox
  • Hola:
    Así mirándo rápidamente sus códigos, lo primero sería cerrar la capa global que parece ser que no lo ha hecho, tiene que poner un </div> debajo de la capa que dice: <div id="pie"> Este es el pie de la página</div>, si así se le arregla , entonces bien, pero si no se le arregla igual tiene que poner ese </div> ya que la capa global es la que engloba a todas las demás, en lo que concierne a los bordes que usted dice, debiera de arreglarse como le digo con ese </div> . Luego se vería si la página está bien relacionada con la hoja de estilo, o sea que coincida el nombre que le tiene puesto a la hoja de estilo, debe ser exactamente igual, ya que debe tener cuidado con alguna mayúscula o con algún espacio.
    Saludos
    PD
    También sería bueno que en la hoja de estilo le pusiera arriba en el body un {text-align:center} por ahora en vez del {text-align:justify}que tiene puesto.
    Agradecido de los que aprenden enseñando
    hola, gracias por tu pronta respuesta, hice lo que dijistes y no pasa nada aun, y el nombre de la carpeta estilos-generales.css esta bien sin espacios y sin mayusculas

    mi hoja de estilo se ve asi ahora :D :

    * {text-indent :opx ; 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 }
    #menu {background-color:yellow; width: 150px ; float:left ; tex:align:left ; margin: 3px 10px 3px 3px }
    #menu li {list-style:none ; margin: 4px 0px 4px 6px}
    #pie {background-color:brown ; border: black 1px solid }
    #curva-superior { background-image: url(objetos/curva-superior.gif) ; background-repeat: no-repeat }
    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 {texta-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}

    Y MI PLANTILLA ASI :D :

    <!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="navegation">Barra de navegacion</div>
    <div id="contenido">
    <div id="menu">
    <lu>
  • enlace 1
  • enlace 2
  • enlace 3</lu>
    </div>
    <h1>Esta sera la zona principal de la web</h1>


    este es mi segundo parrafo, esta es la primera prueva de la pagina que estoy creando y en poco tiempo quedara espectacular</P>
    <h2>espera aque termine y veras que podras navegar en ella </h2>


    mantente en contacto para que te enteres de lo ultimo de mi pagina</p>


    recuerda que en estos momento estamos en construccion pero dentro de poco estara lista por completo, donde tendras mucha divercion</p>


    todo esto gracias a www.comocrear tu web que he aprendido muchisimo, esperenos dentro de poco tiempo, espero que esten bien y muchisima suerte</p>
    </div>
    <div id="pie">Este es el pie de la pagina</div>
    </div>
    <body>
    </html>

    GRACIAS POR SU AYUDA

    nitrox
  • Q tal bro??
    Te puse en rojo y mas grande lo q tiene q ser igual, creo q alli sta la falla (el nombre de la hoja de estilos se llama distinto a como tu lo indicas en tu plantilla:

    hola, gracias por tu pronta respuesta, hice lo que dijistes y no pasa nada aun, y el nombre de la carpeta estilos-generales.css esta bien sin espacios y sin mayusculas

    mi hoja de estilo se ve asi ahora :

    * {text-indent :opx ; 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 }
    #menu {background-color:yellow; width: 150px ; float:left ; tex:align:left ; margin: 3px 10px 3px 3px }
    #menu li {list-style:none ; margin: 4px 0px 4px 6px}
    #pie {background-color:brown ; border: black 1px solid }
    #curva-superior { background-image: url(objetos/curva-superior.gif) ; background-repeat: no-repeat }
    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 {texta-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}

    Y MI PLANTILLA ASI :

    <!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="navegation">Barra de navegacion</div>
    <div id="contenido">
    <div id="menu">
    <lu>
  • enlace 1
  • enlace 2
  • enlace 3</lu>
    </div>
    <h1>Esta sera la zona principal de la web</h1>


    este es mi segundo parrafo, esta es la primera prueva de la pagina que estoy creando y en poco tiempo quedara espectacular</P>
    <h2>espera aque termine y veras que podras navegar en ella </h2>


    mantente en contacto para que te enteres de lo ultimo de mi pagina</p>


    recuerda que en estos momento estamos en construccion pero dentro de poco estara lista por completo, donde tendras mucha divercion</p>


    todo esto gracias a www.comocrear tu web que he aprendido muchisimo, esperenos dentro de poco tiempo, espero que esten bien y muchisima suerte</p>
    </div>
    <div id="pie">Este es el pie de la pagina</div>
    </div>
    <body>
    </html>
  • WiLL
    hola hermano, disculpeme pero me he quedado frenado con lo de los bordes, el nombre esta identico a el del archivo sin mayusculas ni espacios, he echo de todo y no me sale, no se que pasa !!!

    saludos
    l_nitrox escribió:hola, gracias por tu pronta respuesta, hice lo que dijistes y no pasa nada aun, y el nombre de la carpeta estilos-generales.css esta bien sin espacios y sin mayusculas

    mi hoja de estilo se ve asi ahora :D :

    * {text-indent :opx ; 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 }
    #menu {background-color:yellow; width: 150px ; float:left ; tex:align:left ; margin: 3px 10px 3px 3px }
    #menu li {list-style:none ; margin: 4px 0px 4px 6px}
    #pie {background-color:brown ; border: black 1px solid }
    #curva-superior { background-image: url(objetos/curva-superior.gif) ; background-repeat: no-repeat;width:800px;height:12px;overflow:hidden; }
    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 {texta-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}

    Y MI PLANTILLA ASI :D :

    <!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="navegation">Barra de navegacion</div>
    <div id="contenido">
    <div id="menu">
    <lu>
  • enlace 1
  • enlace 2
  • enlace 3</lu>
    </div>
    <h1>Esta sera la zona principal de la web</h1>


    este es mi segundo parrafo, esta es la primera prueva de la pagina que estoy creando y en poco tiempo quedara espectacular</P>
    <h2>espera aque termine y veras que podras navegar en ella </h2>


    mantente en contacto para que te enteres de lo ultimo de mi pagina</p>


    recuerda que en estos momento estamos en construccion pero dentro de poco estara lista por completo, donde tendras mucha divercion</p>


    todo esto gracias a comocrear tu web que he aprendido muchisimo, esperenos dentro de poco tiempo, espero que esten bien y muchisima suerte</p>
    </div>
    <div id="pie">Este es el pie de la pagina</div>
    </div>
    <body>
    </html>

    GRACIAS POR SU AYUDA

    nitrox
  • Hola:
    Por ahora pongalo como le sugiero acá mismo en su mensaje que está sobre mi comentario, verá que a la curva superior le agregué el ancho y el alto y a la vez le agregué un overflow hidden y a la capa cabecera le quité el border top ya que para eso está la curva superior, en todo caso ya iremos arreglándolo.
    Saludos
    Agradecido de los que aprenden enseñando
    hola saludos a todos, llevo ya como una semana tratando de terminar mi pagina pero no logro hacer los estilos, ni colores ni lineas, nada...
    segui sus instrucciones pero aun no he encontrado una solucion, el nombre es el mismo sin errores ni espacios ni nayusculas, ni direccion es la siguiente:
    http://restaurantecheluis.onlinewebshop.net

    ASI ES MI PLANTILLA HTML EN VISTA PREVIA (EN BLANCO)

    Bienvenidos a mi web
    Barra de navegacion
    enlace 1
    enlace 2
    enlace 3
    Esta sera la zona principal de la web
    este es mi segundo parrafo, esta es la primera prueva de la pagina que estoy creando y en poco tiempo quedara espectacular

    espera aque termine y veras que podras navegar en ella
    mantente en contacto para que te enteres de lo ultimo de mi pagina

    recuerda que en estos momento estamos en construccion pero dentro de poco estara lista por completo, donde tendras mucha divercion

    todo esto gracias a www.comocrear tu web que he aprendido muchisimo, esperenos dentro de poco tiempo, espero que esten bien y muchisima suerte

    Este es el pie de la pagina

    ESTE ES MI ESTILO GENERAL :

    * {text-indent :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-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 }
    #menu {background-color:yellow; width: 150px ; float:left ; tex:align:left ; margin: 3px 10px 3px 3px }
    #menu li {list-style:none ; margin: 4px 0px 4px 6px}
    #pie {background-color:brown ; border: black 1px solid }
    #curva-superior { background-image: url (objetos/curva-superior.gif) ; background-repeat: no-repeat ; width: 800px ; height: 12px ; overflow : hidden }
    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 {texta-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}

    Y ESTA ES LA 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="navegation">Barra de navegacion</div>
    <div id="contenido">
    <div id="menu">
    <lu>
  • enlace 1
  • enlace 2
  • enlace 3</lu>
    </div>
    <h1>Esta sera la zona principal de la web</h1>


    este es mi segundo parrafo, esta es la primera prueva de la pagina que estoy creando y en poco tiempo quedara espectacular</P>
    <h2>espera aque termine y veras que podras navegar en ella </h2>


    mantente en contacto para que te enteres de lo ultimo de mi pagina</p>


    recuerda que en estos momento estamos en construccion pero dentro de poco estara lista por completo, donde tendras mucha divercion</p>


    todo esto gracias a www.comocrear tu web que he aprendido muchisimo, esperenos dentro de poco tiempo, espero que esten bien y muchisima suerte</p>
    </div>
    <div id="pie">Este es el pie de la pagina</div>
    </div>
    <body>
    </html>

    LES AGRADEZCO Y ME COLABOREN POR FAVOR...
  • Hola

    primero que nada, al entrar a tu index, no veo los estilos, pero esto es por una sencilla razon

    tu estás enlazando el doc. estilo-general.css

    pero... este documento es de la plantilla no del index

    lo que deberias poner es el estilos.css

    Esto que te digo es en el index ok??????



    En la plantilla si se ven los estilos
    http://restaurantecheluis.onlinewebshop.net/plantilla.html

    saludos