2 columnas con tamaño autoajustable

[Miguel_86]

Hola:
Estoy intentando crear 2 columnas, la de la izquierda quiero que ocupe todo el tamaño libre que quede, y la de la derecha quiero que ocupe un tamaño fijo, 250px y no consigo, si le pongo width: auto a la de la izquierda se pasa y hecha a la de la derecha para abajo, etc lo que tengo ahora es:

http://hostcreativos.com/columna.html

Si alguien me puede hechar una mano se lo agradezco, la idea es que la columna de la izquierda siempre autoajuste al tamaño de pantalla pero que la de la derecha no, que siempre tenga un tamaño fijo.

[jomaruro]

Hola:

Cambia tu código CSS:

Código CSS:

.columnaIzquierda { 
    width: auto;
    display:block; 
    float: left;
    border:thin solid #CCCCCC;
}
.columnaDerecha { 
    width: 250px; 
    float: left; 
    border:thin solid #CCCCCC;
    overflow:hidden;
}
 

Por este otro:

Código CSS:

.columnaIzquierda { 
    /*width: auto;*/
    /*display:block; */
    float: none;
    border:thin solid #CCCCCC;
}
.columnaDerecha { 
    width: 250px;
        float:right;
    border:thin solid #CCCCCC;
    overflow:hidden;
}
 

Espero que te sirva.

Saludos.

[Miguel_86]

Buenas:
Asi lo he puesto pero parece que sigue fallando.

[tredio]

creo que te va a tocar hacer eso con javascript, o no hacer que la columna derecha tenga un ancho fijo, sino que juegues con porcentajes.

[jomaruro]

Hola:

Aunque solo sea para probar ponle a ambas columnas un height:100%.

Saludos.

[Caquilla23]

Hola. En tu código html posiciona primero el div que ira fijo en la derecha y después el div grande.

Un saludo.

[Miguel_86]

Iniciado por tredio

creo que te va a tocar hacer eso con javascript, o no hacer que la columna derecha tenga un ancho fijo, sino que juegues con porcentajes.

Antes de hacerlo con javascript prefiero hacer una tabla.

Ya puse el height 100% pero no va.

Caquilla23 eso como se hace?

[Caquilla23]

Iniciado por Miguel_86

Antes de hacerlo con javascript prefiero hacer una tabla.

Ya puse el height 100% pero no va.

Caquilla23 eso como se hace?

En tu código html tienes:

<div class = "contenedor">bla bla</div>
<div class = "columnaderecha"></div>

Ponlos así:

<div class = "columnaderecha"></div>
<div class = "contenedor">bla bla</div>

[kseso?]

Entiendo la duda de Miguel_86 como la de quien se está iniciando, y lo más importante, intenta algo y recurre al foro al llegar a un punto de estancamiento.

Pero lo que me resulta del todo punto incomprensible es que en un foro de css se vean respuestas como la #4.
Sus temores son infundados, caballero. No le va a tocar recurrir a javascript para componer esa estructura (u otras mucho más complejas). Esa función (crear la grilla) es una de las razones de la existencia de css.
Procure más rigurosidad en sus respuestas.

Miguel, como posíblemente después de lograr ese layout de dos columnas verticales le surgirá colocar un encabezado, y más tarde un cierre o pie de página, mejor le dejo esta recopilación de más de 700 layouts: http://bit.ly/ciHSu3

Seguramente encontrará algo que se ajuste a sus necesidades. Juegue e investigue los códigos implicados, y si le surge alguna cuestión puntual, no dude en consultar al foro.

Atentamente.

[jomaruro]

Hola:

Por lo que veo ya lo has solucionado ¿no?

Saludos.

[Miguel_86]

Iniciado por jomaruro

Hola:

Por lo que veo ya lo has solucionado ¿no?

Saludos.

Mas o menos, ahora lo he integrado en donde lo tenia pensado usar pero me da algunos errores aun, hay alguna forma para que no herede propiedades un div de los padres?

[mayid]

hay alguna forma para que no herede propiedades un div de los padres?

Sobreescribirlas. A que propiedades te referías en particular?