Ver Mensaje Individual
  #12 (permalink)  
Antiguo 06/06/2011, 07:33
Avatar de Ventru3
Ventru3
 
Fecha de Ingreso: noviembre-2010
Ubicación: Disneylandia
Mensajes: 86
Antigüedad: 13 años, 4 meses
Puntos: 13
Respuesta: ¿ Como centrar varios DIV dentro de otro DIV ?

Aprovechando el código que hice antes en otro tema, tengo algo para ti

Código HTML:
Ver original
  1. <div id="wrapper">
  2.         <div id="all-content">
  3.         <div id="content1">
  4.             <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque at adipiscing eros. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Phasellus vulputate tortor ac nulla condimentum fermentum. Nunc convallis dignissim mauris, et viverra metus bibendum eget. Phasellus ultricies placerat vehicula.
  5.         </div>
  6.      
  7.         <div id="content1">
  8.             <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque at adipiscing eros. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Phasellus vulputate tortor ac nulla condimentum fermentum. Nunc convallis dignissim mauris, et viverra metus bibendum eget. Phasellus ultricies placerat vehicula.
  9.         </div>
  10.  
  11.         <div id="content1">
  12.             <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque at adipiscing eros. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Phasellus vulputate tortor ac nulla condimentum fermentum. Nunc convallis dignissim mauris, et viverra metus bibendum eget. Phasellus ultricies placerat vehicula.
  13.         </div>
  14.  
  15.         <div id="content1">
  16.             <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque at adipiscing eros. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Phasellus vulputate tortor ac nulla condimentum fermentum. Nunc convallis dignissim mauris, et viverra metus bibendum eget. Phasellus ultricies placerat vehicula.
  17.         </div>
  18.  
  19.         <div id="content1">
  20.             <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque at adipiscing eros. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Phasellus vulputate tortor ac nulla condimentum fermentum. Nunc convallis dignissim mauris, et viverra metus bibendum eget. Phasellus ultricies placerat vehicula.
  21.         </div>
  22.        
  23.         <div class="clear"></div>
  24.      
  25.         </div>
  26. </div>

Código CSS:
Ver original
  1. html, body {
  2.         height: 100%;
  3.         margin: 0px 0px 0px 0px;
  4.         padding: 0px 0px 0px 0px;
  5.     }
  6.      
  7.     #wrapper {
  8.         width: 900px;
  9.         height: 100%;
  10.         margin: 10px auto;
  11.     }
  12.      
  13.     #all-content {
  14.         width: 900px;
  15.         background-color: #d8d8d8;
  16.         border: 1px solid;
  17.     }
  18.      
  19.     #content1 {
  20.         float: left;
  21.         width: 240px;
  22.         margin: 10px 29px 10px 29px;
  23.         border: 1px solid;
  24.     }
  25.      
  26.     .clear {
  27.         clear: both;
  28.     }

Quedara siempre centrado si el ancho del div content1 es de 240px (como no has especificado que anchura tenían la he elegido yo), su borde es de 1px y el all-content tiene una anchura de 900px.

Son matemáticas puras.

MIERDA, acabo de ver tu ultimo post y si que les has dado un tamaño determinado

Bueno el div content quedaría así con tus medidas.
Código CSS:
Ver original
  1. #content1 {
  2.     float: left;
  3.     width: 140px;
  4.     height: 105px;
  5.     margin: 10px 79px 10px 79px;
  6.     border: 1px solid;
  7.     overflow: scroll; //Por si el contenido es demasiado grande
  8. }

Última edición por Ventru3; 06/06/2011 a las 07:43 Razón: Fallo en las medidas