Problema altura de divs (contenido y menu)

[erfbidejeree]

Hola a todos, antes que nada, decir que he estado buscando en el foro, pero las soluciones que se aportan no me funcionan... Empecemos

Código:

<div id="contenedor">

<div id="seccion">
/// aqui el contenido de la seccion
</div>

<div id="menu">
<a href="seccion"><img src="seccion.gif" /></a>
<a href="seccion"><img src="seccion.gif" /></a>
<a href="seccion"><img src="seccion.gif" /></a>
<a href="seccion"><img src="seccion.gif" /></a>
<a href="seccion"><img src="seccion.gif" /></a>
<a href="seccion"><img src="seccion.gif" /></a>
</div>

</div>

Os explico, el div menu, esta a la derecha, y a parte de tener las imagenes, tiene un fondo, no repetido, que debe estar unido al pie de pagina... bueno asi no me entendereis, con esto mejor:



Bien, pues cuando hay poco contenido perfecto, pero cuando hay mas, la foto se corta y se ve el fondo, así que apliqué una técnica que vi en el foro

Código:

#contenedor {
width:960px;
overflow:auto;
}

#seccion {
float:left;
width:710px;
height:auto !important;
height:700x;
min-height:700px;
border-right: 250px solid #000000;
margin-right: -250px;  
}

#menu {
float:left;
width:250px;
height:auto !important;
height:700px;
min-height:700px;
background: url(lateral.gif) no-repeat bottom;
}

De esta manera ya no se ve el fondo de la pagina, sino la columna estirada pero de color negro, con la imagen que va con el pie de pagina... cortada...

Alguien sabe como lo puedo solucionar?

Gracias!

[subirol]

Si e entendido bien lo que quieres ver es el fondo y no el color negro, si es asi deveria poner:

Código:

#menu {
float:left;
width:250px;
height:auto !important;
height:700px;
min-height:700px;
background: url(lateral.gif) repeat bottom;
}

[erfbidejeree]

gracias por tu respuesta, pero esq lo del menu no es realmente es un fondo, es un trozo de imagen cortada que debe ir encima del pie de pagina, con lo cual no debe repetirse

asi se ve si pongo mas contenido en seccion



y asi si aplico la solucion que de

border-right: 250px solid #000000;
margin-right: -250px;



lo que no quiero es que se corte

[jomaruro]

Hola:

Con el código que has puesto a mí me funciona, los id seccion y menu tienen el mismo tamaño que es lo que a tí te interesa.

Prueba a ponerlo como imagen en lugar de background y aplicale un bottom: 0px.

Saludos.

[erfbidejeree]

Iniciado por jomaruro

Hola:

Con el código que has puesto a mí me funciona, los id seccion y menu tienen el mismo tamaño que es lo que a tí te interesa.

Prueba a ponerlo como imagen en lugar de background y aplicale un bottom: 0px.

Saludos.

con el codigo que he puesto, lo que hace es que se monta encima de un borde que tiene el mismo ancho que el div menu, entonces parece que es el mismo, pero realmente se queda asi



si le quito el atributo heigh pues simplemente ni se muestra el fondo que quiero que aparezca abajo, sino que solamente muestra las imagenes que son botones del menu

[safe]

Creo que si lo que quieres lograr es que la imagen quede siempre arriba a la izquierda del pie de pagina, no tiene sentido que tengas la imagen dividida entre el menu y el footer. Porque directamente no lo podes en el footer y lo colocas en la posicion que quieres con posicion absoluta?

[erfbidejeree]

Iniciado por safe

Creo que si lo que quieres lograr es que la imagen quede siempre arriba a la izquierda del pie de pagina, no tiene sentido que tengas la imagen dividida entre el menu y el footer. Porque directamente no lo podes en el footer y lo colocas en la posicion que quieres con posicion absoluta?

porque quiero que el contenido de la seccion se vea a la izquierda de la parte de la imagen dividida que va en el lateral...

de todas maneras, con un poco de ingenio lo he solucionado, en vez de poner la imagen de fondo al div menu... la he pueso abajo a la derecha en el div contenedor

Código:

#contenedor {
width:960px;
overflow:auto;
background: url(lateral.gif) no-repeat right bottom;
}