Cuando en "Los margenes de los párrafos de la página web" dice lo de poner "#contenido p {padding: 5px 10px 5px 10px}" para arreglar los margenes, ya que los textos estan pegados al menu, en el ejemplo de CCTW queda así:
http://www.comocreartuweb.com/html-kit-tutorial/ejemplos/plantilla-…
Ami poniendo lo mismo, que la "estilo-general.css" me quede asi:
* {margin:0px ; padding:0px ; border: 0px}
body {text-align: center}
#global {width:800px ; margin: 4px auto }
#cabecera {background-color: pink }
#navegacion {background-color: gray }
#menu {background-color: yellow; width: 150px ; float:left ; text-align:left ;
margin-right: 10px }
#pie {background-color: brown }
#contenido {background-color: orange ; width: 800px ; float:left }
#contenido p {padding: 5px 10px 5px 10px}
#menu li{ list-style:none ; margin: 4px 0px 4px 6px }
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}
Y la "plantilla.html" me queda 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="cabecera">Bienvenidos a mi Web</div>
<div id="navegacion">Barra de Navegación</div>
<div id="contenido">
<div id="menu">
<ul>
Elemento de lista, 1 Elemento de lista, 2 Elemento de lista, 3
</div>
Esta será la zona principal de la web</p>
Este es mi segundo párrafo. Acabo de poner un punto y en cambio sigue siendo un párrafo pues no le he colocado aún la etiqueta de cierre. Voy a ponersela justo aquí.</p>
Y este es el tercer párrafo. 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.
Anda, fijate! Salen todos centrados, que cosa. Espero que Jorgens nos enseñe a ponerlos alineados a la izquierda, o justificados. Así esto parece una poesia! je je je.</p>
</div>
<div id="pie">Este es el pié de página</div>
</div>
</body>
</html>
La vista previa no queda igual que en el ejemplo de CCTW , sino que en el ejemplo(no se me ocurre explicarlo de otra forma mas sencilla :roll: ) en la parte que pone "Este es el tercer parrafo..." esta debajo del menu, sin embargo ami me aparece igual que sino hubiera puesto "#contenido p {padding....." . Es decir, lo unico que me cambia esa propiedad es que deja un espacio más grande entre el menu lateral y los dos primeros parrafos, el tercer parrafo sigue centrado(a decir verdad me estoy liando hasta yo jeje). Para que no tengas que mirar para arriba te dejo con link para ver el ejemplo de CCTW.
http://www.comocreartuweb.com/html-kit-tutorial/ejemplos/plantilla-…
Y esa es mi duda, el porque de que el tercer parrafo siga centrado.
http://www.comocreartuweb.com/html-kit-tutorial/ejemplos/plantilla-…
Ami poniendo lo mismo, que la "estilo-general.css" me quede asi:
* {margin:0px ; padding:0px ; border: 0px}
body {text-align: center}
#global {width:800px ; margin: 4px auto }
#cabecera {background-color: pink }
#navegacion {background-color: gray }
#menu {background-color: yellow; width: 150px ; float:left ; text-align:left ;
margin-right: 10px }
#pie {background-color: brown }
#contenido {background-color: orange ; width: 800px ; float:left }
#contenido p {padding: 5px 10px 5px 10px}
#menu li{ list-style:none ; margin: 4px 0px 4px 6px }
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}
Y la "plantilla.html" me queda 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="cabecera">Bienvenidos a mi Web</div>
<div id="navegacion">Barra de Navegación</div>
<div id="contenido">
<div id="menu">
<ul>
</div>
Esta será la zona principal de la web</p>
Este es mi segundo párrafo. Acabo de poner un punto y en cambio sigue siendo un párrafo pues no le he colocado aún la etiqueta de cierre. Voy a ponersela justo aquí.</p>
Y este es el tercer párrafo. 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.
Anda, fijate! Salen todos centrados, que cosa. Espero que Jorgens nos enseñe a ponerlos alineados a la izquierda, o justificados. Así esto parece una poesia! je je je.</p>
</div>
<div id="pie">Este es el pié de página</div>
</div>
</body>
</html>
La vista previa no queda igual que en el ejemplo de CCTW , sino que en el ejemplo(no se me ocurre explicarlo de otra forma mas sencilla :roll: ) en la parte que pone "Este es el tercer parrafo..." esta debajo del menu, sin embargo ami me aparece igual que sino hubiera puesto "#contenido p {padding....." . Es decir, lo unico que me cambia esa propiedad es que deja un espacio más grande entre el menu lateral y los dos primeros parrafos, el tercer parrafo sigue centrado(a decir verdad me estoy liando hasta yo jeje). Para que no tengas que mirar para arriba te dejo con link para ver el ejemplo de CCTW.
http://www.comocreartuweb.com/html-kit-tutorial/ejemplos/plantilla-…
Y esa es mi duda, el porque de que el tercer parrafo siga centrado.