Foros del Web » Creando para Internet » CSS »

Centrar DIV dentro de otro DIV

Estas en el tema de Centrar DIV dentro de otro DIV en el foro de CSS en Foros del Web. A ver, tengo el siguiente código en HTML: Código: <div id="contenido"> <p class="cabecera-texto">PRODUCTOS</p> <div class="productos"> <div class="producto">Producto 1</div> <div class="producto">Producto 2</div> <div class="producto">Producto 3</div> <div ...
  #1 (permalink)  
Antiguo 18/06/2012, 13:14
 
Fecha de Ingreso: junio-2012
Mensajes: 17
Antigüedad: 11 años, 10 meses
Puntos: 0
Centrar DIV dentro de otro DIV

A ver, tengo el siguiente código en HTML:

Código:
<div id="contenido">
  <p class="cabecera-texto">PRODUCTOS</p>
  <div class="productos">
    <div class="producto">Producto 1</div>
    <div class="producto">Producto 2</div>
    <div class="producto">Producto 3</div>
    <div class="producto">Producto 4</div>
    <div class="producto">Producto 5</div>
    <div class="producto">Producto 6</div>
  </div><!-- productos -->
</div> <!-- contenido -->
Y lo que quiero es, dentro del div productos (que contiene los "n" productos de una página), centrar estos para que, sea como sea la medida de la pantalla se vea centrado.

Tengo el div#contenido como un 80% del ancho, por lo que productos tiene ese % menos los márgenes. He intentado mil cosas, pero no consigo que se mantenga siempre centrado, al modificar el ancho de pantalla. ¿Alguna idea? (margin: 0 auto; probado casi de todas las formas).

Gracias, un saludo.
  #2 (permalink)  
Antiguo 18/06/2012, 13:40
 
Fecha de Ingreso: agosto-2010
Mensajes: 215
Antigüedad: 13 años, 8 meses
Puntos: 6
Respuesta: Centrar DIV dentro de otro DIV

con margin bastaria margin:0px auto y si los productos son solo texto mejor crea una lista
  #3 (permalink)  
Antiguo 18/06/2012, 13:54
 
Fecha de Ingreso: junio-2012
Mensajes: 17
Antigüedad: 11 años, 10 meses
Puntos: 0
Respuesta: Centrar DIV dentro de otro DIV

No, los productos son otro div que contiene imagen, título, descripción-precio, botón de compra.
Y no me centra con margin ni poniéndolo en "productos" ni en "contenido".
  #4 (permalink)  
Antiguo 18/06/2012, 14:10
 
Fecha de Ingreso: agosto-2010
Mensajes: 215
Antigüedad: 13 años, 8 meses
Puntos: 6
Respuesta: Centrar DIV dentro de otro DIV

no se si es esto lo que buscas:

Código HTML:
<div id="contenido">
  <p class="cabecera-texto">PRODUCTOS</p>
  <div class="productos">
    <div class="producto1">Producto 1</div>
    <div class="producto2">Producto 2</div>
    <div class="producto1">Producto 3</div>
    <div class="producto2">Producto 4</div>
    <div class="producto1">Producto 5</div>
    <div class="producto2">Producto 6</div>
  </div><!-- productos -->
</div> <!-- contenido --> 
Código PHP:

#contenido{ width:80%; margin:0px auto;background-color:red}
.producto1background-color:greenwidth:80%; margin:0px auto}
.
producto2{background-color:bluewidth:80%; margin:0px auto
  #5 (permalink)  
Antiguo 18/06/2012, 14:17
 
Fecha de Ingreso: junio-2012
Mensajes: 17
Antigüedad: 11 años, 10 meses
Puntos: 0
Respuesta: Centrar DIV dentro de otro DIV

No, es tener 2 - 3 columnas, en función del tamaño de pantalla, y tener todo ese contenedor de productos centrado (las 2 o 3 columnas siempre centradas).
  #6 (permalink)  
Antiguo 18/06/2012, 14:30
 
Fecha de Ingreso: agosto-2010
Mensajes: 215
Antigüedad: 13 años, 8 meses
Puntos: 6
Respuesta: Centrar DIV dentro de otro DIV

pon codigo, ahi esta centrado el contenedor de 80% de tamaño y a su vez puedes poner las columnas que quieras dentro, les das un tamaño en % en relacion a su contenedor y margin para centrarlas.... (este es un el resultado del codigo que pusiste)
  #7 (permalink)  
Antiguo 18/06/2012, 14:46
 
Fecha de Ingreso: junio-2012
Mensajes: 17
Antigüedad: 11 años, 10 meses
Puntos: 0
Respuesta: Centrar DIV dentro de otro DIV

Haciendo eso lo que pasa es que siempre voy a tener bien 2 o bien 3 columnas en función del % que ponga, y aumentando/disminuyendo el tamaño de cada producto.

Pero es una buena idea para tenerlo centrado, si no consigo lo que quiero supongo que lo haré así, gracias.
  #8 (permalink)  
Antiguo 03/04/2014, 13:59
 
Fecha de Ingreso: marzo-2008
Mensajes: 9
Antigüedad: 16 años, 1 mes
Puntos: 0
Respuesta: Centrar DIV dentro de otro DIV

Cita:
Iniciado por xav_ogame Ver Mensaje
Haciendo eso lo que pasa es que siempre voy a tener bien 2 o bien 3 columnas en función del % que ponga, y aumentando/disminuyendo el tamaño de cada producto.

Pero es una buena idea para tenerlo centrado, si no consigo lo que quiero supongo que lo haré así, gracias.
Muchísimas gracias, me sirvió mucho, los dos datos fueron muy útiles

Hasta pronto!
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 05:41.