DUDAS LECCION 2 AQUI

Vaya, la ultima consulta del dia 1 y sin solucion. :-(

Aun asi intentare ver si podeis solucionar mi problema :-)

No se si el problema ha salido ya pero a la hora de realizar el menu de los enlaces me lo ha creado todo bien solo que no me sale todo centrado. He realizado los pasos que se mencionan en la guia y lo mio no se parece en nada a lo de la guia.

Codigo del curso:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Page title</title>
<link rel="stylesheet" href="estilo-general-10.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 2
  • Enlace 3
    </div>
    Esta será la zona principal de la web
    </div>
    <div id="pie">Este es el pié de página</div>
    </div>
    </body>
    </html>

  • Mi codigo del programa:

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <html>
    <head><link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
    <title>Page title</title>
    </head>
    <body>
    <div id="global"
    <div id="cabecera">Bienvenidos a mi Web</div>
    <div id="navegacion">Barra de navegacion</div>
    <div id="contenido">
    <div id="menu">
    <ul>
  • Elemento de lista 1
  • Elemento de lista 2
  • Elemento de lista 3
  • Elemento de lista 4
    </div>
    esta sera la zona principal de la web
    </div>
    <div id="pie">Este es el pie de la pagina</div>
    </div>
    </body>
    </html>

  • Y aqui el de estilos:

    * {margin:0px ; padding:0px ; border: 0px}
    #cabecera {background-color: pink } ;
    #navegacion {background-color: grey };
    #contenido {background-color: orange ; width:800 ; float:left};
    #pie {background-color: brown ; width=800 ; float:left} ;
    #global {width:800px ; margin: 4px auto}
    body {text-align: center}
    #menu{background-color: yellow ; width=200px ; float: left; text-align:left}
    #menu li {list-style:none}
    a {color:green ; font-size:1.3em ; text-decoration:none ; display:blocks}
    a:link {}
    a:visited{}
    a:hover{color:red ; text-decoration:underline ; background-color:silver}
    a:active{}
    .centrado {text-align:center}

    Muchas gracias por la ayuda y por el foro y la web. Mientras tanto seguire con el curso.


    P.D: El tamaño en el pie lo puse yo pero aun asi no queda bien.

    P.P.D: Utilizo Firefox por si resulta interesante.
    hola
    en rojo lo que falta
    <div id="global">

    debe ser
    width:800px
    #pie {background-color: brown ; width=800 ; float:left} ;

    #menu{background-color: yellow ; width=200px ;
    float: left; text-align:left}

    debe ser block
    a {color:green ; font-size:1.3em ; text-decoration:none ; display:blocks}

    yy debes ordenar el css
    asi claro con sus debidas correciones

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

    body {text-align: center}
    #global {width:800px ; margin: 4px auto}
    #cabecera {background-color: pink } ;
    #navegacion {background-color: grey };
    #contenido {background-color: orange ; width:800 ; float:left};
    #menu{background-color: yellow ; width=200px ; float: left; text-align:left}
    #menu li {list-style:none}
    #pie {background-color: brown ; width=800 ; float:left} ;

    a {color:green ; font-size:1.3em ; text-decoration:none ; display:blocks}
    a:link {}
    a:visited{}
    a:hover{color:red ; text-decoration:underline ; background-color:silver}
    a:active{}
    Ya se muestra correctamente.

    Lo dicho, gracias y perdon por semejante fallo ^_^

    Saludos,
    la verdad como estoy en el paso 2 yo no he publicado aun esto en ningun hosting, esta en mi equipo.
    algunos efectos de los enlaces solo funcionan en la red

    sigue el curso, y cuando lo hayas subido nos lo muestras

    saludos
    Hola, aqui esta la preguntona,
    no se que pasa que lo entiendo, parece que lo hago bien, pero cuando doy a viata previa no me queda como deveria.
    tengo puesto esto en plantilla:

    <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 navegacion</div>
    <div id="contenido">
    <div id="menu">
    <ul>
  • <a href= "#">Elemento de lista, 1
  • <a href= "#">Elemento de lista, 2
  • <a href= "#">Elemento de lista, 3

    </div>
    Esta sera la zona principal de la web</div>
    <div id="pie"> Este es el pie de la pagina</div>


    </body>
    </html>

    Y en estilos esto otro

    * {margin:0px ; padding:0px ; border: 0px}
    body{text-align:center}
    #global{width:800;margin:4px auto}
    #cabecera {background-color: pink }
    #navegacion{background-color:gray}
    #contenido{background-color:orange;width:800px;float:left}
    #menu{background-color:yellow;width:150px;float:left;text-align:left}

    #menu li{list-style:note;margin:4px 0px 4px 6px}
    a{color:brown;text-decoration:none}
    a:link {}
    a:visited{}
    a:hover{color:red;text-decoration:underline}
    a:active{}
    #pie{background-color:brown}

    Os cuento, con todo esto tendria que cambiar el color solo del menu, pues tambien se me cambia el color del pie y a parte no solo cuando me pongo encima de las letras del pie sino en la barra, se cambia la ultima fila del menu y el pie.
    Espero que lo entendais y me podais ayudar haber si he puesto algo mal.
    Gracias
  • Hola, estoy intentando eliminar los puntos del menu li, pero no me funciona
    He revisado varias veces la hoja de estilo y no encuentro el fallo
    Haber si podeis ayudarme

    PLANTILLA
    <!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">Pagina Web Prueba</div>
    <div id="navegacion">Barra de navegacion</div>
    <div id="contenido">Esta será la zona principal de la web</div>
    <div id="menu">menu</div>
    <ul>
  • Enlace 1
  • Enlace 2
  • Enlace 3

    <div id="pie">Este es el pié de página</div>
    </div>

    </body>
    </html>

    HOJA ESTILOS

    * {margin:0px ; padding:0px ; border: 0px}
    body {text-align: center}
    #global {width:800px ; margin: 4px auto }
    #cabecera {background-color: red }
    #navegacion {background-color: gray }
    #contenido {background-color: orange ; width: 800px ; float:left}
    #menu {background-color: yellow; width: 150px ; float:left; text-align:left}
    #pie {background-color: brown}
    #menu li{list-style: none; margin: 4px 0px 4px 6px}

    Espero vuestra ayuda
    Muchas gracias por adelantado
  • Yony_046, pienso que has debido de crear un tema nuevo.

    No es así:

    <div id="menu">menu</div>
    <ul>
  • Enlace 1
  • Enlace 2
  • Enlace 3


    Es así:

    <div id="menu">
    <ul>
  • Enlace 1
  • Enlace 2
  • Enlace 3
    </div>

    Saludos.
  • Muchas gracias por contestar e interesarte por mi avance en el curso.
    Ya encontre el fallo a base de probar y probar cosas.
    Si es como tu me ponias, que lastima no haberlo visto antes, me hubiese ahorrado un par de ratos largos que estuve hasta encontrar la solucion.
    A veces soy muy cabezona y hasta que no logro saber como se hace una cosa no avanzo, asiq me quede estancada en eso.
    Gracias de nuevo
    Buenas otra vez!!....esta vez me andaba preguntando que para empezar siempre una pagina web debemos de poner esto siempre?

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

    imaginaros que cuando acabo el curso quiero hacerlo mediante el notepad el cual no te ayuda como el html-hit,debo empezar siempre con esa cabecera?...y seguidamente poner html abrir head,body etcetera....

    se que parece un poco estupido preguntar esto,pero es para recalcarlo......y si me podeis explicar que significa un poco esa cabecera del DOCTYPE........

    saludos y gracias una vez mas.
    Perdon he utilizado este espacio para responder una pregunta que no pertenece a esta sala...xxdd.
    Acabo de hablar sobre si usar DW o el html-kit y la verdad que por pura logica todos aconsejan aprender con el html-kit,

    Y luego pasate al programa que tu quieras por que si no te pasa esto te pierdes por no saber el manejo del programa....

    hazme caso hazte todo el curso con el html-kit...si no te volvera a pasar y por esa misma razon no me cambiado y asi no tengo problemas,...saludos,.
    #contenido {background-color: orange ; width: 800px ; float:left}
    #contenido p {padding: 5px 10px 5px 10px ; text-indent: 15px}

    Bien,la duda que yo tengo en este ejemplo y creo que no lo explica en el curso es la "p" que hay en el 2o contenido...para que yo lo tenga mas claro,alguien me puede decir que hace esa "p".
    #contenido {background-color: orange ; width: 800px ; float:left}
    #contenido p {padding: 5px 10px 5px 10px ; text-indent: 15px}

    aqui le estás dando propiedades al div como tal, tamaño, margen, pading, color de fondo, etc etc, ok???

    aqui le estás dando propiedades al texto "p" (pero solamente el que esté dentro del div contenido,) es decir todo lo que esté entre las etiquietas

    </p> tendran esas propiedades... si tu ahi le pones
    background-color:pink
    verás como el div contenido es color naranja, pero el texto (lo que esté en "p" tendrá color de fondo rosa...

    si por ejemplo en el div pie, tienes tambien texto encerrado en

    ese no sufrirá cambios, ya que por eso indicamos #contenido p (parrafo dentro de contenido)


    me explique????? :roll:
    Si si esta mas clarito gracias,entonces esa "p" no tiene nada que ver con padding,ok es por la orden de el parrafo..ok.....pues muchas gracias....y seguro que preguntare mucho mas...jejeej...muy amable Yaneth.
    Resulta que ahora estoy subiendo los archivos a la carpeta azul,lo tengo todo,

    No me da la opcion de crear una nueva carpeta en la carpeta azul,para poner la de objetos......entendeis?......y en el ejemplo no pone nada de que me vaya a dar problemas.

    nada ya lo tengo solucionao...llevo to el dia aqui metio...y creo que el cerebro me da vueltas a la derecha y la cabeza a la izquierda,asi que voy a descansar por hoy....jajajaj....

    saludos y gracias por vuestra valiosisima atencion y lo mejor nuestro gran Jorgens.....larga vida!!!...a los justos!!!....xxdd.
    mmm

    a veces el programa se aloca
    y se resuelve reiniciandolo

    intentalo y si no, vuelves a postear sale???
    hola quería saber si alguien puede decirme por que estoy en la lecion II y cuando quiero ver como va quedando no me aparece los colores solo el texto

    esto es lo que tengo hasta el momento en el htm

    !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <html>
    <head>
    <title>Page title</title>
    <link rel="stylesheet"herf="estilo-general.css"type="text/css" media="all">
    </head>
    <body>

    <div id="global">
    <div id="cabecera">Bienvenidos a mi página web!</div>
    <div id="navegacion">Barra de Navegación</div>
    <div id="contenido">Esta será la zona principal de la web</div>
    <div id="pie">Este es el pié de página</div>
    </div id>

    </body>
    </html>
    y esto en estilos.css
    #cabecera {background-color: pink }
    #navegacion {background-color: gray }
    #contenido {background-color: Aquamarine }
    #pie {background-color: DeepPink1 }
    #global {width:800px ; margin: 4px auto }
    body {text-align: center}
    en el css

    debes acomodar todo por orden del html

    body
    cabecera
    navegacion

    etc etc

    y si no ves los colores, es porque no están bien relacionadas el html y el css
    checa exactamente como se llama tu hoja de estilos
    y aqui
    <link rel="stylesheet"herf="estilo-general.css"type="text/css" media="all">

    debe ser
    href

    saludos
    Hola,

    Es mi primera vez (en el foro) y no estoy muy segura de que esto vaya aquí...

    Estoy siguiendo el curso y tengo una sugerencia.

    En la Lección 2 -- Estilos para Listas -- Reparando el fallo del menú

    Donde pone:

    #contenido {background-color: orange ; width: 800px ; float:left}

    Funciona igual si pones:

    #contenido {background-color: orange ; width: 100% ; float:left}

    De esta manera el contenido ocupa del 100% del espacio en el que está alojado (en este caso el div "general") y si cambias el tamaño de este, no es necesario retocar el tamaño de "contenido"
    poco a poco irás haciendo tus pruebas
    y verás como hay varios caminos para un solo objetivo

    saludos
    Antes de nada mi gratitud por el excelente trabajo que estais haciendo.
    Mi duda es algo extraña, almenos para mi que no domino el tema.
    Estoy en la lección 2, y tengo problemas con la primera instruccion escrita en el "body" despues del <div id="global>, y digo la primera instruccion, porque depende de cual sea falla una cosa u otra.
    Al principio me fallaba el color rosa de la "cabecera", pero ahora al añadirle el redondeo de esquinas superiores, por encima de la linea de la "cabecera", el color rosa ha vuelto, y lo que no se ve es el redondeado superior.
    todo empezo a fallar al hacer click con el raton sobre el numero de la linea por error, aparecio una chincheta, y clicke de nuevo para quitarla sin cambiar nada, o eso pensaba yo.

    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="navegacion">Barra de Navegación</div>
    <div id="contenido">
    <div id="menu">
    <ul><li><a href="#">Enlace 1</a></li><li><a href="#">Enlace 2</a></li><li><a href="#">Enlace 3</a></li></ul>
    </div>
    <h1>Esta será la zona principal de la web</h1>
    <p>El segundo parrafo de esta web resulta ser muy largo y se ve de un modo extraño si no lo retoco un poco, porque esta alineado el texto el la hoja de estilo body alineado al centro, asi que ahora lo vamos a alinear concretamente hacia la izquierda, esperemos que quede bien, aunque tengo que alargarlo bastantemas, por no decir mucho mas, para ver el resultado junto al menu y debajo de él, e ir corrigiendo los errores sobre la marcha</p>
    <h2>Y este es el tercer párrafo.</h2>
    <p>En pocas lecciones aprenderé a darle margenes para separarlos unos de otros, e incluso hacerles sanguias por la izquierda a la primera línea, que queda mucho mejor.</p>
    </div>
    <div id="pie"> Este es el pié de página</div>
    </div>
    </body>
    </html>

    Y esta es la hoja de estilo-general.css:

    * {margin:0px ; padding:0px ; border: 0px}

    body {text-align: center }

    #global {width:800px ; margin: 4px auto }

    #curva-superior { background-image: url(objetos/curva-superior.gif) ; background-repeat: no-repeat ;width:800px ; height: 12px ;overflow : hidden}}

    #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: 3px 10px 3px 3px}

    #menu li { list-style:none ; margin: 4px 0px 4px 6px}

    #pie {background-color: brown ; border: black 1px solid}

    a {color: brown; text-decoration: none ; display: block }
    a:link {}
    a:visited {color: pink; text-decoration: none}
    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}

    Espero que me podais solucionar el problema. Yo he probado a añadir una linea antes tanto poniendo un titulo sin texto h1, sin exito, como doblar la instruccion de la curbatura de las esquinas, cosa que funciono a medias, ya que se veia mas pequeña que la pagina pese a estar definido el tamaño en estilo-general, algo que tambien me pasa al poner la curva inferior, me sale mas pequeña.
    Esta es la web colgada, por si la quereis ver: http://ironkick.onlinewebshop.net/plantilla.html
    hola

    en efecto el problema está en esta linea

    <div id="global>

    ves por que???????
    te falta cerrar las comillas de global asi

    "global"

    saludos y no olvides votar por cctw