Atascada en la leccion 2: se activan los div

Hola:

La primera lección me ha ido muy bien :) ; en esta segunda no consigo poner color a los div ni fijar la anchura.
:(
Estos son los códigos de la plantilla:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head><link rel="stylesheet" href="estilo-general-06.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">Esta sera la parte principal de la web</div>
<div id="pie">Este es el pie de página</div>
</div>

</body>
</html>

Y estos los códigos de la página de estilo general
#cabecera {background-color: pink }
body {text-align: center}
#navegacion {background-color: gray }
#contenido {background-color: orange}
#pie {background-color: brown}
#global {width:800px ; margin: 4px auto }

¿Me podéis echar una mano? ¿Qué estoy haciendo mal?

Gracias mil.

Lola

Estoy impresionada con el trabajazo de esta :o web
Lola escribió:Hola:

La primera lección me ha ido muy bien :) ; en esta segunda no consigo poner color a los div ni fijar la anchura.
:(
Estos son los códigos de la plantilla:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head><link rel="stylesheet" href="estilo-general-06.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">Esta sera la parte principal de la web</div>
<div id="pie">Este es el pie de página</div>
</div>

</body>
</html>

Y estos los códigos de la página de estilo general
#cabecera {background-color: pink }
body {text-align: center}
#navegacion {background-color: gray }
#contenido {background-color: orange}
#pie {background-color: brown}
#global {width:800px ; margin: 4px auto }

¿Me podéis echar una mano? ¿Qué estoy haciendo mal?

Gracias mil.

Lola

Estoy impresionada con el trabajazo de esta :o web

2 cosas:

1- ¿Como se llama tu hoja de estilos? Deberia llamarse estilo-general-06.css, sino te va a andar mal.

2 - No se si esto influye pero creo que deberias poner todo en orden, es decir, en lugar de asi:


#cabecera {background-color: pink }
body {text-align: center}
#navegacion {background-color: gray }
#contenido {background-color: orange}
#pie {background-color: brown}
#global {width:800px ; margin: 4px auto }

así:

body {text-align: center}
#global {width:800px ; margin: 4px auto }
#cabecera {background-color: pink }
#navegacion {background-color: gray }
#contenido {background-color: orange}
#pie {background-color: brown}
Hola

para empezar te diré que debes sir acomodando las cosas en la hoja de estilos segun su aparicion en el html

asi:
body {text-align: center}

#cabecera {background-color: pink }
#global {width:800px ; margin: 4px auto }
#navegacion {background-color: gray }
#contenido {background-color: orange}
#pie {background-color: brown}


ahora checa bien como es que se llama la hoja de estilos
asi:?????

estilo-general-06.css

recuerda que hay diferencia entre mayusculas y minusculas

saludos
Hola:

Otra vez atascada. !Uf me siento muy desgraciada! :cry:

El menú no aparece a la izquierda, no aparece en amarillo, o puedo quitar los puntos a la lista y el pie me parece en la parte derecha de la página.

Una pregunta ¿cuando Jorgens habla de Hoja de estilos entiendo que se refiera a "estilo-general-06.css? ¿Es así?

Os copio mis desgracias:

Estilo-general-06.css
* {margin:0px ; padding:0px ; border: 0px}
body {text-align: center}
#global {width:800px ; 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 }
#menu li { list-style:none }
#pie {background-color: brown}

Plantilla:<html>
<head><link rel="stylesheet" href="estilo-general-06.css" type="text/css" media="all">
</head>
<body>
<div id="cabecera">Bienvenidos a mi Web</div>
<div id="navegacion">Barra de navegación</div>
<div id="contenido">
<div ="menu">
<ul>
  • Enlace 1Elemento lista 1
  • Enlace 2Elemento lista 2
  • Enlace 3Elemento lista 3

    </div>
    Está será la parte principal de la web
    </div>
    <div id="pie">Este es el pie de página</div>
    </body>
    </html>

    Me gustaría copiaros la "preview" pero no sé como hacerlo.

    Si podési echarme una mano os lo agradezco. Un cordial saludo.

    Lola
  • Pues quítale el float:left al contenido, y los colores no los escribas así, sino con los códigos.
    Tu hoja de estilos como se llama? estilo-general-06.css o Estilo-general-06.css?
    Saludos :wink:
    el fallo está aqui

    en rojo lo que te falta

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

    </div>


    saludos
  • Gracias mil por vuestra ayuda. He corregido lo que me deciais.

    Por ahora voy a dejar de hacer la web en html, de momento no tengo la cabeza (!ya peino canas! para seguir y tampoco tengo tiempo (quería presentar la web como trabajo para un curso on line que estoy haciendo y ya me decido a buscar una plantilla para hacerlo.

    !En fin! Espero volver más adelante.

    Gracias otra vez por vuestra inestimable y rápida ayuda.
    :lol:

    Lola