Hola todos.
He estado siguiendo un libro HTML5, CSS3 y javascript. Pero ya viendo un poco sobre el modelo de caja tradicional, hay algo del ejercicio que estoy haciendo, que realmente no entiendo el por qué de aplicar dicha propiedad.
<!DOCTYPE html />
...
<header id="cabecero">
<hgroup>
<h2>Libro de HTML, CSS y javascript
</h2> </hgroup>
</header>
<nav id="menu">
</nav>
<section id="sección">
<figure>
<img src="imagenes/avatar-fb.png" alt="avatar"/> <figcaption>
avatar del usuario
</figcaption>
</figure>
<article>
<header>
<p>estoy aprendiendo estructuras
<cite>html
</cite></p> </header>
<footer>
comentarios del articulo
</footer>
</article>
</section>
<aside id="barra_lateral">
</aside>
<footer id="creditos"><small>Derechos reservados paman
</small></footer>
mi archivo css:
* {
margin: 0px;
padding: 0px;
}
body{ /* por qué ? */
text-align: center;
}
header, nav, figcaption,hgroup,footer,aside,section,article{
display: block;
}
#contenedor{
width: 960px;
margin: 15px auto;
text-align: left;
}
#cabecero{
padding: 20px;
background-color: cadetblue;
}
#menu {
padding: 10px;;
background-color: gray;
height: 20px;
}
#menu li{
display: inline-block;
padding-left: 20px;
list-style: none;
}
#sección {
float: left;
width: 600px;
margin-top: 2px;
margin-right: 10px;
padding: 20px;
background-color: brown;
}
#barra_lateral {
float: left;
width: 270px;
height: 253px;
margin-top: 2px;
padding: 20px;
background-color: brown;
}
#creditos{
clear: both;
background-color: cadetblue;
padding: 20px;
text-align: center;
}
h1 {
font: bold 25px verdana, sans-serif;
}
h2 {
font: bold 15px verdana, sans-serif;
}
Básicamente no entiendo porque hay que alinear el texto al centro del body, si luego lo vamos a volver alinear a la izquierda. Peor aún, ¿Por qué alinear el texto si por default ya estaría a la izquierda?.
Gracias.