Hola, como te ha comentado StripTM, cuando no tengas B, asigna a body otra clase, de forma que puedas diferenciar el diseño en las css.
Te he dejado un ejemplo en http://webpelon.es/ovillo/2009-mes03-30-Conmuta_una_o_dos_columnas/index.html Esencialmente, contiene el código siguiente: HTML página CON B (DOS columnas) <div id="content"> <div id="A"> </div> <div id="B"> </div> <div id="C"> </div> </div> <!-- Fin #content --> HTML página SIN B (UNA columnas) <div id="content" *class="una_columna"*> <div id="A"> </div> <div id="B"> </div> <div id="C"> </div> </div> <!-- Fin #content --> CSS #content { margin: 0 auto; /* centra el div contenedor (necesita width) */ width: 35em; overflow: hidden; /* engloba a floats internos */ } #A { float: left; width: 14em; /* mismo ancho que #C */ } #B { float: right; width: 20em; /* ancho #A + ancho #B menor que ancho contenedor */ } #C { width: 14em; /* mismo ancho que #A */ } /* Cuando #B no existe entonces #A y #C se ajustan al contenedor */ .una_columna #A, .una_columna #C { width: auto; } Saludos El 29 de marzo de 2009 20:19, Tae Sandoval Murgan <[email protected]>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 > utilizando posicionamiento: > > #content { > margin-left: auto; > margin-right: auto; > position: relative; > width: 35em; } > #A { > width: 35em; } > #B { > left: 35em; > margin: 0; > position: absolute; > top: 0; } > #C { > width: 35em; > position: relative; > top: 12em; } > > Pero, al estar B posicionado de forma absoluta, se ubica con respecto > a content, ¡fuera de él!. Sí content tiene una propiedad min-width en > lugar de width, contiene a B, pero usa el ancho total del lienzo y > todo se va a la izquierda en lugar de ocupar el centro. Y he ahí la > cuestión. > > 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. > _______________________________________________ > 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 > _______________________________________________ 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
