Foros del Web » Creando para Internet » CSS »

Pongo float y no lo toma como contenido

Estas en el tema de Pongo float y no lo toma como contenido en el foro de CSS en Foros del Web. Hola a todos, la cosa es asi, la estructura de mi pagina es algo asi: <div id="todo"> <div id="header"> Un par de divs aca </div> ...
  #1 (permalink)  
Antiguo 07/02/2008, 21:31
Avatar de Falhor  
Fecha de Ingreso: diciembre-2005
Ubicación: Buenos Aires
Mensajes: 425
Antigüedad: 12 años
Puntos: 5
Pongo float y no lo toma como contenido

Hola a todos, la cosa es asi, la estructura de mi pagina es algo asi:

<div id="todo">
<div id="header">
Un par de divs aca
</div>
<div id="contenido">
Aca el problema
</div>

Y en CSS:

#contenido{
background-color:#000000;
}

El problema es que yo necesito poner 3 divs mas o menos en la misma fila, es decir, uno al lado de otro.
Probe con float, pero queda como que los divs estan fuera de "contenido", y el fondo no se ve.
Tambien probe poner un height: 100% pero no funciono, y no puedo poner una determinada cantidad de px porque puede variar la cantidad.

A ver si alguien me puede ayudar.

Saludos.
  #2 (permalink)  
Antiguo 07/02/2008, 21:41
 
Fecha de Ingreso: noviembre-2007
Mensajes: 60
Antigüedad: 10 años
Puntos: 2
Re: Pongo float y no lo toma como contenido

Osea, basicamente, lo que vos queres hacer es meter tres divs en fila dentro de contenido. Bien.

Código HTML:
 <div id="todo">

          <div id="header">
          Un par de divs aca
          </div>

          <div id="contenido">
               Aca el problema
          </div>

     </div> 
En este caso, debes definir el ancho de contenido. Por ejemplo, 100%;

Código:
     #contenido {
          width:100%,
     }
Ahora que tenes el contenido, le metes los tres DIVs

Código HTML:
 <div id="todo">

          <div id="header">
          Un par de divs aca
          </div>

          <div id="contenido">
               <div class="cajon" id="cajon-1">
                    Contenido Cajon 1
               </div>
               <div class="cajon" id="cajon-2">
                    Contenido Cajon 2
               </div>
               <div class="cajon" id="cajon-3">
                    Contenido Cajon 3
               </div>
          </div>

     </div> 
Ahora, el CSS quedaria algo asi:

Código:
     #contenido {
          width:100%,
     }
          #contenido div.cajon {
               width:30%;
               float:left;
          }
Entonces con esto, te quedarian tres cajitas dentro del contenido.
Luego, si necesitas agregarle padding a las cajas, acordate de restarle el padding al ancho del DIV, para evitar problemas con desbordes.

Saludos y espero que ayude!
  #3 (permalink)  
Antiguo 07/02/2008, 21:50
Avatar de Falhor  
Fecha de Ingreso: diciembre-2005
Ubicación: Buenos Aires
Mensajes: 425
Antigüedad: 12 años
Puntos: 5
Re: Pongo float y no lo toma como contenido

Solucionado!

Gracias.

Última edición por Falhor; 08/02/2008 a las 01:34
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 04:06.