Entrar

No me sale como deberia

Xenon · · Solicitar retirada
Bueno, lo primero hola a tod@s y loo segundo es haber si alguien me puede ayudar:
Bueno este es mi problema, hago todo lo que pone en el tutorial y me sale diferente, muy diferente.....Aqui os dejo los datos con una captura:

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="cabecera">Bienvenidos a mi Web</div>
<div id="navegacion">Barra de Navegación</div>
<div id="contenido">

<div id="menu">
<ul>
  • Enlace 1
  • Enlace 1
  • Enlace 1
    <div>
    Esta será la zona principal de la web
    <div>
    <div id="pie">Este es el pie de la pagina</div>
    </div>


    </body>
    </html>


    ESTILO-GENERAL.CSS

    body {text-align: center}
    #global {width:800px ; margin: 4px auto }
    #cabecera {background-color: red }
    #navegacion {background-color: gray }
    #contenido {background-color: orange}
    #menu {background-color: yellow ; width: 150px ; float:left ; text-align:left }
    #pie {background-color: brown}
    #contenido {background-color: orange ; width: 800px ; float:left }
    * {margin:0px ; padding:0px ; border: 0px }
    #menu li {list-style:none ; margin: 4px 0px 4px 6px }
    a {color: blue; font-size:1.3em ; text-decoration: none }
    a:link {color: red ; text-decoration: none }
    a:visited {color: black ; text-decoration: none }
    a:hover {color: red ; text-decoration: underline }
    a:active {color: brown ; text-decoration: none }
    a {color: brown ; text-decoration:none ; display: block }

    CAPTURA

    [contenido no disponible]

    ESTO ES LO QUE ME TENDRIA QUE SALIR

    http://www.comocreartuweb.com/html-kit-tutorial/plantilla-10.html


    Por favor ayudadme :lol:
    • Deathly Snake · · Solicitar retirada
    Hola!!

    Creo que encontré el error:

    Este es tu codigo de 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="cabecera">Bienvenidos a mi Web</div>
    <div id="navegacion">Barra de Navegación</div>
    <div id="contenido">

    <div id="menu">
    <ul>
  • Enlace 1
  • Enlace 1
  • Enlace 1
    </div>
    Esta será la zona principal de la web
    </div>
    <div id="pie">Este es el pie de la pagina</div>
    </div>


    </body>
    </html>
    Lo rojo es lo que debes agregar, las 2 barritas

    Saludoss!!!
    • DarkPatriot · · Solicitar retirada
    Macho, tengo el mismo problema que tu, pero a mi me sale de otra forma. Lo único que puedo decirte es que * {margin:0px ; padding:0px ; border: 0px } tiene que ir al principio de todo, no se si cambiara mucho la cosa, pero lo dice en el tutorial.
    power · · Solicitar retirada
    si le has puesto lo de las barras /

    prueba ha ponerle al div pie esto

    :arrow: #pie {background-color: brown ; width:800px}
    Xenon · · Solicitar retirada
    CRACK!!! Deathly Snake Muchisimas gracias por la ayuda, si efectivamente era eso. Muchas gracias a todos y cualquier duda que tenga os la pregunto en un nuevo tema para no crear confusiones

    Muchas gracias :roll:
    Xenon · · Solicitar retirada
    Oye perdonar, pero tengo una pregunta mas como hago mas pequeños los enlaces?¿ Quiero decir, lo de enlace 1 Enlace 2....Esque se me ve muy grande y en el ejemplo en canvio se ve bastante mas pequeño.....
    power · · Solicitar retirada
    ESTILO-GENERAL.CSS

    body {text-align: center}
    #global {width:800px ; margin: 4px auto }
    #cabecera {background-color: red }
    #navegacion {background-color: gray }
    #contenido {background-color: orange}
    #menu {background-color: yellow ; width: 150px ; float:left ; text-align:left }
    #pie {background-color: brown}
    #contenido {background-color: orange ; width: 800px ; float:left }
    * {margin:0px ; padding:0px ; border: 0px }
    #menu li {list-style:none ; margin: 4px 0px 4px 6px }
    a {color: blue; font-size:1.3em; text-decoration: none }
    a:link {color: red ; text-decoration: none }
    a:visited {color: black ; text-decoration: none }
    a:hover {color: red ; text-decoration: underline }
    a:active {color: brown ; text-decoration: none }
    a {color: brown ; text-decoration:none ; display: block }

    :arrow: variadon lo de font-size :1.3 a otro por ejemplo 1.0 sera mas pequeño