ajustar slide imágenes a div flotante

[red_robe]

tengo un div centrado en medio de la pantalla, dentro a mano izquierda hay un texto (ancho 40%) que se va reescalando y a derecha un slide de imágenes, que me gustaría reescalar en función de la resolución a un 50 - 55% de ancho.

el problema del slide es que está en absolute, he probado mil combinaciones con firebug y no consigo dar con la solución. la idea es que este slide vaya dentro de la capa con borde azul y fondo crema.

a ver si algun maestro del css puede dar con la solución :):)

aquí el enlace donde pueden testear:
http://pretest.somee.com

muchas gracias tod@s!

[moro666]

Hem, bueno, no es mut dificil, solo tienes un pequeño problema, las imagenes son mas grandes que el marco azul, pero bueno, eso es facil de cambiar xD.

Hago una listita de cambios:

style.css linea 265 #slides --> position: relative; top & left:0;
style.css linea 278 .slides_container -->margin-left:0;
style.css linea 289 #slides .slide -->padding:0;

Luego ya tansolo redimensiona las imagenes al tamaño que te vaya mejor.

[red_robe]

Iniciado por moro666

Hem, bueno, no es mut dificil, solo tienes un pequeño problema, las imagenes son mas grandes que el marco azul, pero bueno, eso es facil de cambiar xD.

Hago una listita de cambios:

style.css linea 265 #slides --> position: relative; top & left:0;
style.css linea 278 .slides_container -->margin-left:0;
style.css linea 289 #slides .slide -->padding:0;

Luego ya tansolo redimensiona las imagenes al tamaño que te vaya mejor.

gracias! he cambiado estas propiedadesm a parte de otras muchas más, estoy muy cerca de la solución:
http://pretest.somee.com

ahora me muestra solo una parte de la imagen, y en cambio, justo abajo a la izquierda he cargado la misma imagen en otro contenedor y me la muestra toda.

como es que en la clase .right2 no le puedo asignar un min-height (limitar altura a un mínimo) dependiendo de la resolución de pantalla, de momento le he puesto un height. buffff..esto del css es un mundo.

Muchas gracias, espero vuestras respuestas, suerte del firebug!!

[moro666]

Vale, la solucion a tu problema ahora no esta en el css. xDD
Tu tienes una imagen que hace (me lo invento) 100px por 150px, y un marco de las mismas dimensiones, asi que la imagen cabe perfectamente en el marco, la parte que no te sale es debido a los controles del slider, es decir, lo que puedes hacer es la imagen menos alta o el marco mas alto, o sino poner los controles encima de la imagen.

No se si me he explicado del todo bien!

[red_robe]

gracias moro666, ya entiendo lo que quieres decir, estoy probando de volver a estructurar los contenedores pero no consigo dar con el problema.

desmotivado es poco..llevo demasiado con esto, creo que buscaré otro slide imágenes más simple para poderlo integrar.

[moro666]

Mira, en:
.slides_container cambia a height: 360px;
Haz ambos recuadros mas amplios y ya tendras la imagen entera!

y añadiendo una clasee:
.pagination {
position: absolute;
margin-top: -43px;
z-index: 9;
}

Con lo que los controles quedan encima de la imagen!

[red_robe]

ya casi lo tengo, gracias! ahora solo me queda reescalar la imagen dentro del contenedor.

a ancho de resolución 1366 se ve bien, pero al reducir a 1280 o 1024 la magen se va recortando :S. He probado de hacer un

Código:

background-position:-50px -50px;

pero esto sería solo para resoluciones bajas.