Cita:
Iniciado por jmb0286 
A quien corresponda mi nombre es Matías soy novato en esto yestoy haciendo un proyecto personal - una página web - con el siguiente código, en dreamweaver.
<style type="text/css">
.contenedor {
color: #FFF;
background-color: #CCC;
clear: left;
float: left;
height: 915px;
width: 700px;
}
.herramientas {
color: #FFF;
background-color: #666;
clear: left;
float: left;
height: 20px;
width: 100%;
margin-top: 15px;
}
.cabecera {
color: #FFF;
background-color: #999;
clear: left;
float: left;
height: 150px;
width: 100%;
}
.menu {
background-color: #F60;
clear: both;
float: left;
height: 30px;
width: 100%;
}
.noticias {
background-color: #CCC;
float: left;
height: 400px;
width: 50%;
margin-top: 15px;
color: #000;
background-image: url(imagenes/contenidos_noticias.png);
}
.videos {
background-color: #CCC;
float: right;
height: 400px;
width: 50%;
margin-top: 15px;
color: #000;
background-image: url(imagenes/contenidos_videos.png);
}
.imagenes {
background-color: #999;
clear: both;
float: left;
width: 100%;
height: 150px;
color: #000;
}
.publicidad {
background-color: #9CF;
clear: both;
float: left;
width: 100%;
margin-top: 15px;
height: 100px;
color: #000;
}
.copyright {
background-color: #F90;
clear: both;
float: left;
height: 20px;
width: 100%;
color: #000;
}
body {
background-color: #333;
margin-top: 15px;
}
</style>
</head>
<body>
<div class="contenedor" id="contenedor">
<div class="herramientas" id="herramientas"></div>
<div class="cabecera" id="cabecera"></div>
<div class="menu" id="menu"> </div>
<div class="videos" id="videos"></div>
<div class="noticias" id="noticias"></div>
<div class="imagenes" id="imagenes"></div>
<div class="publicidad" id="publicidad"></div>
<div class="copyright" id="copyright"></div>
</div>
</body>
</html>
Lo que quiero saber es lo siguiente:
1. Como puedo centrar el div contenedor para que queda centrada la página
2. Y si ven algún problema en el código para que al subirla al servidor se pueda
ver bien en los nevegadores del usuario.
Desde ya muchas gracias.
Hola, te daría la bienvenida pero también soy nueva en el foro.
Yendo a lo tuyo supongo que quieres centrar horizontalmente tu pagina.
Suponiendo que ".contenedor" es el contenedor que tu quieres centrar , primero que nada debes eliminar ese float: left que lo que hace es que flote hacia la izquierda. Y el clear: left también debes eliminarlo, en conclusión debe quedarte algo así.
Código HTML:
.contenedor {
margin: 0 auto;
color: #FFF;
background-color: #CCC;
height: 915px;
width: 700px;
}
Lo único que hice fue eliminar float y clear y agregar margenes. Ahora por lo que veo en tu selector usas un class y no un id en éste caso como es el contenedor de tu web debes usar id. En el xhtml donde diga
Código HTML:
class="contenedor"
deberías cambiarlo por un
Código HTML:
id="contenedor"
y el css cambiar el
por un
Código HTML:
#contenedor.
Y otra cosa veo que estableciste una altura y eso provocará que si tu contenido no tenga espacio suficiente se desborde. Te sugiero elimines
Código HTML:
height: 915px;
o bien lo sustituyas por un
o
Código HTML:
un heght:100%.
Aquí puedes encontrar más sobre centrado horizontal:
http://www.librosweb.es/css/capitulo12/centrar_una_pagina_horizontalmente.html
Y también aunque es poco usado el centrado vertical:
http://www.librosweb.es/css/capitulo12/centrar_una_pagina_verticalmente.html
Saludos