Gracias por la web flow, me sirvio para aprender un poco más. Ya conseguí posicionar todas las capas, o casi. Tengo un pequeño problema, os pongo primero un dibujo con la distribucion.
[contenido no disponible]
Os explico como tengo las capas
Capa Global: Cabecera y Cuerpo
Capa Cabecera: Blanco y Logo
Capa Cuerpo: Menu y Contenido
Capa Contenido: Parrafo
Todo son capas (divs). Las conseguí distribuir como os muestro, el problema me viene con la capa PARRAFO. No sé porque solo se centra en IE, en Firefox,Safari y Opera no se centra, ya probe a poner el text-align:center; en todos los lados y nada, y también con el padding y el margin, pero se descuadra. Haber si veis algo en el codigo.
Codigo HTML
* {margin:0px ; padding:0px ; border:0px;} /*Ponemos todos los margenes, bordes y separaciones a cero, para que todos los
navegadores los vean iguales*/
/*como lo separo por capas (divs) las centro para que salga en todos los navegadores*/
body
{
text-align: center;
}
/*Caracteristicas de los enlances */
a
{
color:brown;
text-decoration:none;
display:block;
}
a:link
{
}
a:visited
{
}
a:hover
{
color:red;
text-decoration:underline;
background-color:silver;
}
a:active
{
}
/*Fin enlaces*/
/*Caracteristicas de los títulos (h1 y h2)*/
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;
}
/*Fin Carateristicas de los titulos*/
/* Caracteristicas de los parrafos en general*/
p
{
font-family:Century Gothic,Verdana,Sans-Serif,Arial;
font-size:15px;
text-align:justify;
}
/*Fin Caracteristicas de los parrafos en general*/
/*Caracteristicas de las capas*/
#global
{
margin:5px auto; /*dejo 5 px arriba y abajo, y que lo haga automatico a la izq y la derch*/
width:800px;
}
/*Caracteristicas de las capas de la cabecera*/
#cabecera
{
background-color:green;
height:100px;
border-bottom:3px solid black;
}
#blanco
{
float:left;
background-color:red;
width:100px;
height:100px;
border-right:3px solid black;
}
#logo
{
float:right;
background-color:pink;
width:697px;
height:100px;
}
/*Fin caracteristicas de las capas cabeceras*/
/*Caracteristicas de la capas del Cuerpo*/
#cuerpo
{
background-color:yellow;
width:800px;
}
#menu
{
background-color:gray;
float:left;
border-right:3px solid black;
width:100px;
}
#menu li
{
list-style:none;
padding:4px 8px 4px 6px;
margin:2px;
}
#contenido
{
background-color:blue;
width:697px;
float:right;
text-align: center;
}
#contenido h1
{
font-family:Century Gothic,Verdana,Sans-Serif,Arial;
font-size:2em;
text-align:center;
color:red;
}
.parrafo /*capa para separar los parrafos*/
{
margin:15px 15px 15px 15px;
background-color:white;
border-top:3px solid black;
width:600px;
}
.parrafo p
{
font-family:Century Gothic, Verdana, Sans-Serif, Arial;
font-size:15px;
text-align:justify;
}
/*fin capa cuerpo*/
Codigo HTML
<html>
<title>
Asturtrame
</title>
<head>
<link rel="stylesheet" href="formato.css" type="text/css" media="all">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<!--
-->
</head>
<body>
<div id="global">
<div id="cabecera">
<div id="blanco">
Blanco</p>
</div>
<div id="Logo">
Logo</p>
</div>
</div>
<div id="cuerpo">
<div id="menu"> <!--Tengo que poner la lista seguida, porque al poner la propiedad display:block se me separan los enlaces
así consigo que esto no ocurra-->
<h1>Menu</h1>
<ul>[*][url="#"]Principal[/url][*][url="#"]¿Qué es Asturtrame?[/url][*][url="#"]Fotos[/url][*][url="#"]Videos[/url][*][url="#"]Contacta[/url][/list]
</div>
<div id="contenido">
<h1>Contenido</h1>
<div class="parrafo">
Nelson Piquet logró el primero de sus tres títulos en 1981 a los mandos de un Brabham BT49 en un equipo dirigido por Bernie Ecclestone. Aquel monoplaza incorporaba un sistema de suspensión hidroneumática revolucionario. Mañana, en el circuito del Jarama, Joaquín Folch, el único español presente en la F-1 Histórica, intentará ganar el gran premio final de esta competición con ese mismo coche azul y blanco patrocinado por la marca de leche Parmalat.
Folch, propietario de Industrias Titán y una de las mayores fortunas de España, es un apasionado de las carreras. Campeón de Europa con un Lotus en 1993 y 94, ha ganado este año en Spa, fue segundo en Nurburgring y Silverstone, y en Hockenheim subió al podio en tercer lugar. El catalán será una de las grandes atracciones de la carrera que comenzará a las 12:00 en el Jarama. En este certamen compiten monoplazas de F-1 entre 1968 y 1985. Pero también habrá otras carreras. A partir de las 10:20 se disputará la primera manga de la Orwell Cup, barquetas de los años 70 y 80. y hoy, a las 17:00, tendrá lugar la primera carrera de la Euroboss, coches de F-1, Indy Car y F-3000 entre 1989 y 1997.
Además de disfrutar con el museo más rápido del mundo, Ferrari, con Marc Gené a los mandos, hará una exhibición con el F2007 campeón del mundo a partir de las 13:00 horas de mañana. Será emocionante volver a ver los monoplazas de F-1 en el trazado madrileño cuando se cumplen 40 años del primer gran premio, disputado en 1968 con victoria de Graham Hill, el último tuvo lugar en 1981 con triunfo de Gilles Villeneuve. Las entradas, desde 10 euros. También hasta mañana se puede admirar la colección de clásicos en el Retiro.</p>
</div>
</div>
</div>
</div>
</body>
</html>
