Ver Mensaje Individual
  #1 (permalink)  
Antiguo 04/11/2014, 20:31
dilan_snoopy
 
Fecha de Ingreso: septiembre-2013
Mensajes: 57
Antigüedad: 10 años, 7 meses
Puntos: 0
Problemas con div's

saludos compañeros

lo que sucede es que tengo problemas para organizar el contenido de mi pagina web, es decir no puedo ubicar bien un div dentro del div del contenido alguien me podria ayudar si es alguna propiedad que me falta porque puedo centrar el div interno pero al hacer un margin top baja es el div de contenido y no el interno

como la imagen



este es mi fragmento html
Código:
  <!--***********************Cuerpo de la pagina*************--> 
                 <div id="contenido">
                        <div id="contenido-log">
                            <div id=log></div>
                        
                        </div> 
                   
                 </div>
y este es mi css
Código:
* {
    margin: 0px;
    padding: 0px;
}

body{
    background-color:#e7e6e6;
    height: 100%;
    width: 100%;
}   

#contenedor{  
    width: 1000px;
    box-shadow: -15px 0 40px 0 rgba(0, 0, 0, 0.2),15px 0 40px 0 rgba(0, 0, 0, 0.2);
    background: #ccc;
    margin: 15px auto;
} 

/****************Banner de la aplicacio**************/
#header{
    width:1000px;
    background-color:#FFFFFF;
    height: 200px;
    margin-bottom: 10px;
    margin: 0 auto;
    padding: 0px;
}

/*****************Cuerpo de la aplicacion************/
#contenido{
    margin: auto;
    margin-top:36px;
    width: 1000px;
    background-color:rgba(206, 215, 214, 0.80);
    height: auto;
    text-align: center;
}

/**************Footer de la Aplicacion**************/
footer {
    clear: both;
    background-color: #cec9c9;
    text-align: center;
    padding: 0.4em;
    color: rgba(255, 0, 0, 0.87);
    border-top: 0.4rem solid #6a0f13;

}

footer h3,h4{
    padding-bottom: 0.3em;
    padding-top: 0.3em;
    font: bold 90% monospace;
    color: #000;
}
/*******************Menu horizontal*******************/
#menu  {
      width: 100%;
      float: left;
      padding: 0;
      list-style: none;
      background-color: #f2f2f2;
      border-bottom: 1px solid #ccc; 
      border-top: 1px solid #ccc; 
    
}

#menu  ul {
    margin-top:1px;
    width:100%;
    padding: .0em;
    float: left;
    list-style: none;
    background-color: #f2f2f2;
}

#menu  li {
    float:left;
}
#menu li  a {
      display: block;
      padding: 8px 8px;
      text-decoration: none;
      font-weight: bold;
      color: #069;
      border-right: 1px solid #ccc;
 }

#menu a:hover, nav a:focus {
    outline: 0;
    color: #c00;
    text-shadow: 0 1px 0 rgba(0,0,0,.2);
    background: #fff;
 } 

#menu  a:active {
    box-shadow: 0 0 2px 2px rgba(0,0,0,.3) inset;
}
 
#menu  li:first-child a {
    border-left: 0;
}
/***************Parte del Administrador*****************/
#menu-ver{
    width: 250px;
    height: 700px;
    background: rgba(0, 0, 0, 0.2);
    float: left;
}

#contenido-admin{
    width: 750px;
    height: 700px;
    background: #fff;
    float: right;   
    text-align: center;
}

#contenido-log{
   text-align: center;
   position: relative;
   width:1000px;
   height:500px;
   margin: auto;
}

#log{
    width: 400px;
    height: 300px;
    margin:0 auto;
    margin-top: 50px;
    background: #f00;
}

/************************Menu Vertical********************/
#nav { margin: 0; padding: 0; float: left; }
#nav li { list-style: none; background: #e7e6e6; width: 250px; border-bottom: 1px solid #666; }
#nav li a { display: block; padding: 8px; border-left: 4px solid #444; text-decoration: none; box-shadow: 2px 2px 5px #ccc; color: #555; }
#nav li a:hover { border-left: 4px solid #069; background: #f8f8f8; }
#nav li ul { display: none; }
#nav li:hover ul { display: block; }
#nav li:hover ul li { background: #333; }
#nav li:hover ul li a { color: #ccc; }
#nav li:hover ul li a:hover { background: #222; border-left: 4px solid #900; }
si me quieren aconsejar algo mas sera bien recibido :D
gracias