Ver Mensaje Individual
  #1 (permalink)  
Antiguo 07/09/2014, 20:22
silmasur
 
Fecha de Ingreso: septiembre-2014
Mensajes: 2
Antigüedad: 10 años, 2 meses
Puntos: 0
No centra un div en pantalla

Hola estoy haciendo un div con hover y no me centra los div y no sé qué pueda estar haciendo mal. Ayuda por favor. Pasaré el cod.

<!doctype html>

<html lang="es">

<head>
<title> Prueba</title>
<meta charset="utf-8"/>
<link rel="stylesheet" href="prueba.css">


</head>
<body bgcolor="#2f4544">

<center><img src="fondo.jpg"></center>
<div id="header"></div>

<div class="contenedor" id="uno">
<a href="NewProject.html"><img class="icon" src="imagen/home.png"></a>
<p class="texto">Inicio</p>
</div>

<div class="contenedor" id="dos">
<a href="compania.html"><img class="icon" src="imagen/compania.png"></a>
<p class="texto">Nuestra Compañía</p>
</div>

<div class="contenedor" id="tres">
<a href="productos.html"><img class="icon" src="imagen/productos2.png"></a>
<p class="texto">Productos</p>
</div>

<div class="contenedor" id="cuatro">
<a href="promo.html"><img class="icon" src="imagen/promo.png"></a>
<p class="texto">Promo del Mes</p>
</div>

<div class="contenedor" id="cinco">
<a href="clientes.html"><img class="icon" src="imagen/clientes2.png"></a>
<p class="texto">Clientes</p>
</div>

<div class="contenedor" id="seis">
<a href="contacto.html"><img class="icon" src="imagen/contactos.png"></a>
<p class="texto">Contacto</p>
</div>

</header>

</body>

</html>

////////////////////////////////////////////////////////////////////////////////////////////

*{
margin:0px;
padding:0px;
font-family: arial;
color:white
}

#header{
margin:0px auto;
width:960px;
height:180px;
background-color: rgb(14, 161, 156);

}

div.contenedor{
margin:0px;
width:160px;
height: 180px;
float:left;
-webkit-transition: height .4s;
-webkit-box-shadow: 4px 4px 7px 1px #191d1c;

}

div#uno{
background-color: rgb(10, 115, 111);

}

div#dos{
background-color: rgb(12, 138, 133);

}

div#tres{
background-color: rgb(14, 161, 156);
}


div#cuatro{
background-color: rgb(16, 184, 178);

}

div#cinco{
background-color: rgb(18, 207, 200);

}

div#seis{
background-color: rgb(40, 235, 228);

}


img.icon{
display: block;
margin:30px auto;
background-color: rgba(255,255,255,.15);
width:40px;
padding:20px;
-webkit-border-radius: 50%;
-webkit-box-shadow: 0px 0px 0px 30px rgba(255,255,255,0);
-webkit-transition:box-shadow .4s;
}

p.texto{
font-size: 3;
color:white;
text-align: center;
padding-top:0px;
opacity: .9;
-webkit-transition: padding-top .4s;
font-family: arial;
}

p.historia{
font-size: 3;
color:white;
text-align: justify;
padding-top:0px;
opacity: .9;
-webkit-transition: padding-top .4s;
font-family: verdana;

}


div.contenedor:hover{
height:200px;
}

div.contenedor:hover p.texto{
padding-top: 30px;
opacity: 1;
}

div.contenedor:hover img.icon{
-webkit-box-shadow:0px 0px 0px 0px rgba(255,255,255,.6);
}





gracias de antemano