[Ovillo] Centrar contenedor de elementos absolutos y ancho dinámico

Dom Mar 29 18:55:47 UTC 2009

Tae Sandoval Murgan escribió:
> Saludos a todos:
>
> He diseñado el wireframe de un sitio de la siguiente manera:
>
> --------------------------
> |           |            |
> |     A    |            |
> |-----------|     B     |
> |           |            |
> |     C    |            |
> |           |            |
> |           |            |
> --------------------------
>
> El contenido del elemento B tiene más importancia que el de C, por
> ello y pensando en que las páginas podrían llegar a mostrarse sin los
> archivos CSS, he escrito el HTML de la siguiente manera:
>
> <body>
>    <div id="content">
>        <div id="A"></div>
>        <div id="B"></div>
>        <div id="C"></div>
>    </div>
> </body>
>
> Ahora, la idea es que ese esquema permanezca centrado independiente de
> la resolución de la pantalla, pero el asunto se complica debido a que
> hay páginas en las que B no aparece, y además, en las que lo hace, no
> siempre tiene el mismo ancho. Resolví el asunto de forma parcial
>
>   

> He pensado en usar float, pero ello condicionaría la ubicación de los
> elementos en el HTML, así que la opción que me queda es usar un CSS
> extra especificando el ancho de content según el propio de B y si
> existe o no y de sus dimensiones, pero si pudiera ahorrarmelo con un
> par de instrucciones
> en CSS, mejor que mejor :)
>
> ¿Alguna idea? Gracias de antemano.
>   
Yo no me comería mucho la cabeza y tendría un par de modelos de página, 
se puede simplificar haciendo que sólamente uno de los modelos incluya 
los cambios, pero a modo didáctico sería algo así:

<body class="incluyeB>
   <div id="content">
       <div id="A"></div>
       <div id="B"></div>
       <div id="C"></div>
   </div>
</body>

<body class="noIncluyeB">
   <div id="content">
       <div id="A"></div>
       <div id="C"></div>
   </div>
</body>


-- 
Saludos -=stripTM=-