No puedo dejar un div fijo a la derecha

ci2000 · #1 (**permalink**) 09/04/2009, 08:50

Hola tengo tres divs:

Código HTML:

<body>
        <div id="contenedor">
            <div id="columna">
            </div>
            <div id="columna2">
            </div>
        </div>
</body>

y el CSS:

Código:

* {
    margin:0;
    padding:0;
}

html, body {
    height: 100%;
}

#contenedor {
    width: 100%;
    height: 100%;
    margin:0;
    background-color: #ccc;
	
}

#columna {
    height: 100%;
    float: left;
    width: 200px;
    background-color: #f00;
	overflow:auto;
	
}

#columna2 {
    height: 100%;
    float: left;
	width:800px;
    background-color:#00FF99;
	overflow:auto;
}

Cuando el navegador está maximizado veo todo ok. Pero al recudir el tamaño de la ventana el div columna2 pasa para abajo de columna1. Quiero que no suceda eso, es decir que columna2 permanezca a la derecha.

Gracias desde ya por las respuestas.
Saludos

ci2000 · #2 (**permalink**) 09/04/2009, 08:51

Quise decir reducir el tamaño de la ventana.

willyfc · #3 (**permalink**) 09/04/2009, 08:58

deja esta parte así:

Código:

#columna2 {
    height: 100%;
    background-color:#00FF99;
	overflow:auto;
}

y luego colocas un ancho minimo para que no se deforme:

Código:

#contenedor {
	min-width:770px;
    width: 100%;
    height: 100%;
    margin:0;
    background-color: #ccc;
	
}

y para ie6:

Código:

<!--[if IE 6]><style>#contenedor {width:expression(
(document.documentElement.clientWidth < 770)? "700px" : "auto"
   );}</style><![endif]-->

espero te sirva

denica001 · #4 (**permalink**) 09/04/2009, 23:16

Al div "contenedor" definile un ancho en pixeles igual o mas grande que la suma de los anchos de los dos divs que contiene.
Definile el atributo position="relative".
Probalo y contame

Saludos.