Div flotante no responde a max-width y min-width

[Gooppy]

Hola, tengo un problema con mi código. Quiero que suceda que al verse la página en una resolución de 1024 x 768 el div contenedor se vea con su maximo indicado que es 900 px de width y que el div derecha también se vea con su maximo indicado, que es 320px de width. Pero que al verse la página en una resolución de 800 x 600 tanto contenido como derecha se vean con sus minimos de width indicados, pero solo contenedor lo hace como quiero que sea, mientras que el div derecha a pesar de estar con las indicaciones de max-width y min-width las ignora y queda como si solo le hubiera puesto width: 180px. Será que estoy haciedo mal todo? Es lo que quiero posible?

Espero me puedan ayudar. Gracias de antemano por leer (=.

Aquí dejo mi código:

Código PHP:

  html, body, img
{
    margin:0;
    padding:0;
    border:0;
}
 
#contenedor{
   max-width: 900px;
   min-width: 764px;
   width: 98%;
   background-color:#009999;
   margin: 0 auto;
}
 
 
#izquierda {
   width: 500px;
   height: 200px;
   float:left;
   background-color:#FFFFFF;
   border:solid 1px #000;
}
 
#derecha {
   max-width: 320px;
   min-width: 180px;
   float:right;
   background-color:#FFFFFF;
   border:solid 1px #000;
   height: 20px;
} 
   

Código PHP:

  <div id="contenedor">
<div id="izquierda"></div>
<div id="derecha"></div>
<div style="clear: both;"></div>
</div> 
   

[codecweb98]

Si lo estas viendo en IE 6 max-width y min-width no funcionan. Yo usaria algo asi para evitar los desbordes:

#derecha {
width: 320px;
overflow: hidden;
}

[Gooppy]

Hola! Gracias por tu respuesta, pero aún no resuelvo el problema )=.

El problema es que el div "derecha" además de no hacer caso a los valores max-width y min-width, se queda como si le hubiera marcado un width fijo de 180px y no entiendo porque hace eso. Lo que quiero es precisamente lo que expliqué arriba, solo que no sé si se pueda hacer o esté cometiendo algún error. Quiero que el DIV Derecha se ajuste según el div contenido, cuando contenido se contraiga que derecha también lo haga y tenga minimo 180px de width y que cuando contenido se expanda, derecha tenga maximo 320px de width, pero no he podido hacerlo aún.

Espero alguién pueda ayudarme (=. Saludos!

[Mikmoro]

Pero le indicas un máximo y un mínimo, ¿en base a qué? ¿qué haría cambiar el tamaño a la caja derecha? nada.
Quiero decir, si te fijas, en el contenedor le marcas un width en porcentaje además del max y el min, pero a la caja derecha no, y no tendría por qué alcanzar nunca el max ni el min que le indicas, porque nada la haría cambiar.

[Gooppy]

Iniciado por Mikmoro

Pero le indicas un máximo y un mínimo, ¿en base a qué? ¿qué haría cambiar el tamaño a la caja derecha? nada.
Quiero decir, si te fijas, en el contenedor le marcas un width en porcentaje además del max y el min, pero a la caja derecha no, y no tendría por qué alcanzar nunca el max ni el min que le indicas, porque nada la haría cambiar.

¿Como puedo hacerla cambiar? Mi idea era que al quedar contenedor con su minimo de 764px la caja derecha también se redujera en su ancho, ya que "izquierda" no debe cambiar su ancho, solo derecha. Es por eso que le di esas medidas a "derecha", pero tienes razón, no le he especificado en base a que tiene que cambiar, supuse que se ajustaría sola al contraerse "contenedor", pero no lo hace, se queda con una medida fija de 180px, se queda con su minimo y no con su máximo, que también sería malo /=.

Hay alguna forma de hacer lo que requiero?
Si me he explicado mal, no se entiende o algo, por favor, indiquenmelo );.

Gracias nuevamente.

[Mikmoro]

Sí, quitándole el flotado (float: right), con lo que la caja derecha deberá ajustarse al resto de espacio disponible. Prueba y hablamos.

[Gooppy]

Iniciado por Mikmoro

Sí, quitándole el flotado (float: right), con lo que la caja derecha deberá ajustarse al resto de espacio disponible. Prueba y hablamos.

Hola, muchas gracias! :D Por fin la caja derecha hace lo que quería que hiciera, se ajusta al espacio disponible cuando el contenedor se reduce (=.

Mi código quedó así:

Código PHP:

  #derecha {
   width: auto;
   background-color:#FFFFFF;
   border:solid 1px #000;
   height: 20px;
} 
   

Gracias nuevamente. Saludos! .