<!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";>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
    .contenedor {width:100%; margin:30px auto;}
    .div1 {float:left; width:25%; background:yellow;}
    .div2 {float:left; width:25%; background:lime;}
    .div3 {background:red;}
</style>
</head>

<body>

    <div class="contenedor">
        <div class="div1">Contenido 1</div>
        <div class="div2">Contenido 2</div>
        <div class="div3">Contenido 3</div>
    </div>

    <div class="contenedor">
        <div class="div2">Contenido 2</div>
        <div class="div3">Contenido 3</div>
    </div>

</body>
</html>












2008/8/22 Ignacio Ricci <[EMAIL PROTECTED]>

> Es CSS básico... Pruebenlo.
>
>
> 2008/8/22 xanfran <[EMAIL PROTECTED]>
>
> Hola Ignacio
>>
>> ¿Y eso funciona? Lo digo porque creo que si el contenido de la columna
>> #derecha es mayor que la de # medio, el contenido de #derecha acabará
>> posicionándose debajo de #medio.
>>
>> La solución de Almorca si que la veo más correcta. Sumar a la columna que
>> se
>> desea, el ancho de la columna que ocultas, para que las columnas que
>> queden
>> visibles, ocupen el 100%
>>
>> 2008/8/22 Ignacio Ricci <[EMAIL PROTECTED]>
>>
>> > Fácil:
>> >
>> > *#derecha {}*
>> >
>> > Que no flote, y que no tenga ancho. Tomará el espacio que le queda y se
>> > acoplará al div flotador izquierdo.
>> >
>> > 2008/8/22 Almorca <[EMAIL PROTECTED]>
>> >
>> > > Con lo que has puesto no te se decir a ciencia cierta pero yo creo que
>> lo
>> > > que te pasa es que ocultas #izquierda pero a #medio no le dice que
>> pase a
>> > > ocupar 50%. Si puedes poner la dirección donde está la web te podré
>> dar
>> > una
>> > > solución más «aproximada».
>> > >
>> > > El 22 de agosto de 2008 19:31, alarkspur <[EMAIL PROTECTED]>
>> escribió:
>> > >
>> > > > Buenas lista,
>> > > >
>> > > > Ji, me ha quedado un asunto de mail muy "galletita de la suerte"
>> bueno
>> > > > al grano, verán, en mi empeño por aprender css estaba generando una
>> > > > plantilla de 3 columnas, el código tal que así (pongo solo lo
>> general
>> > > > para no extenderme mucho)
>> > > >
>> > > > #content { width: 100%}
>> > > >
>> > > > #izquierda { width: 25%; float: left}
>> > > >
>> > > > #medio {width: 25%; float: left}
>> > > >
>> > > > #derecha {width: 50%; float: left}
>> > > >
>> > > > Las 3 columnas (izquierda, medio y derecha) se encuentran dentro del
>> > > > div content
>> > > >
>> > > > He preparado un javascript muy molón que me oculta #izquierda si así
>> > > > se desea, lo que ocurre es que al ocultar #izquierda el texto que se
>> > > > encuentra en #derecha no fluye para ajustarse al espacio en blanco
>> que
>> > > > ha quedado en el margen derecha.
>> > > >
>> > > > He probado a insertar varios div con un widht: 100% y unos cuantos
>> > > > autos dentro de #derecha pero no ha habido manera :-(
>> > > >
>> > > > Podrían orientarme para si es posible realizar lo que les comento.
>> > > >
>> > > > Muchas gracias por la ayuda.
>> > > >
>> > > > Un saludo.
>> > > >
>> > > >
>> > > >
>> > > > _______________________________________________
>> > > > Lista de distribución Ovillo
>> > > > Para escribir a la lista, envia un correo a [email protected]
>> > > > Puedes modificar tus datos o desuscribirte en la siguiente
>> dirección:
>> > > > http://lists.ovillo.org/mailman/listinfo/ovillo
>> > > >
>> > >
>> > >
>> > >
>> > > --
>> > > We don't need no education - Pink Floyd
>> > > _______________________________________________
>> > > Lista de distribución Ovillo
>> > > Para escribir a la lista, envia un correo a [email protected]
>> > > Puedes modificar tus datos o desuscribirte en la siguiente dirección:
>> > > http://lists.ovillo.org/mailman/listinfo/ovillo
>> > >
>> >
>> >
>> >
>> > --
>> > ↓۝ Ignacio Ricci
>> > www.ignacioricci.com
>> > _______________________________________________
>> > Lista de distribución Ovillo
>> > Para escribir a la lista, envia un correo a [email protected]
>> > Puedes modificar tus datos o desuscribirte en la siguiente dirección:
>> > http://lists.ovillo.org/mailman/listinfo/ovillo
>> >
>>
>>
>>
>> --
>> Un saludo
>> _______________________________________________
>> Lista de distribución Ovillo
>> Para escribir a la lista, envia un correo a [email protected]
>> Puedes modificar tus datos o desuscribirte en la siguiente dirección:
>> http://lists.ovillo.org/mailman/listinfo/ovillo
>>
>
>
>
> --
> ↓۝ Ignacio Ricci
> www.ignacioricci.com
>



-- 
↓۝ Ignacio Ricci
www.ignacioricci.com
_______________________________________________
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a [email protected]
Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
http://lists.ovillo.org/mailman/listinfo/ovillo

Responder a