dar margenes a div

towi62 · #1 (**permalink**) 19/06/2012, 10:28

Necesito dar unos margenes a unos div para que esto me quede asi:

y mi codigo es este:

Código HTML:

Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es-es">
<head>
<title>Interferencias by Rafael</title>
 
<style type="text/css">
#divPadre {
    height:100px;
    width:800px;
    background-color:blue;
        overflow: hidden;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-top: -100px;
    margin-left: -150px;
}
 
#cajon1 {
    float:left;
    margin:0px auto;
background:#CC6600;
}
#cajon3 {
    clear:both;
    margin:0px auto;
background:#CC6600;
}
 
 
</style>
</head>
    <body>
        <div id="divPadre">
        <div id="cajon1">
DonMango 
</div>
<div id="cajon3">
Registro de usuarios
</div>
        </div>
    </body>
</html>

quiero hacer que los divs hijos queden centrado dentro del padre y el div donde dice registro de usuarios no tenga el mismo ancho que el div padre
Muchas gracias por regalarme un poco de su tiempo.

towi62 · #2 (**permalink**) 19/06/2012, 11:13

ya lo solucione, poniendole un pandding al div padre, de todas formas muchas grasias

towi62 · #3 (**permalink**) 19/06/2012, 11:38

Cita:

Iniciado por towi62

ya lo solucione, poniendole un pandding al div padre, de todas formas muchas grasias

El de los div hijos ya lo solucione poniendole un pandding, pero me falta el div padre que todo se pega al lado de la pantalla derecha y no se como centrarlo bien

towi62 · #4 (**permalink**) 19/06/2012, 11:44

Listo amigos he solucionado el problema aqui pongo el codigo, muchas grasias a todos aquellos que me prestaron atencion

Código CSS:

Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es-es">
<head>
<title>Interferencias by Rafael</title>
 
<style type="text/css">
#divPadre {
 
    background-color:blue;
        overflow: hidden;
        padding:25px; 
        position: absolute; 
        top: 100px; 
        left: 200px; 
         width: 400px; 
         height: 100px;">
 
 
}
 
#cajon1 {
    float:left;
background:#CC6600;
 
}
#cajon3 {
   float:left;
    clear:both;
    margin:0px auto;
background:#CC6600;
}
 
 
</style>
</head>
    <body>
        <div id="divPadre">
        <div id="cajon1">
DonMango 
</div>
<div id="cajon3">
Registro de usuarios 
</div>
        </div>
    </body>
</html>

kseso? · #5 (**permalink**) 19/06/2012, 12:58

Consulte aquí. Quizás le ayude.