Hola. Tengo un problema con las capas en el diseño que intento hacer:
tengo en una capa contenedora un marco a la izquierda y una capa float:right con una tabla de fotos en miniatura a la derecha. mediante js, al pinchar en las miniaturas, se carga una foto en el marco. la capa de las tablas tiene un scroll para poder visualizar todas las miniaturas que se salen de ella.
El problema es que hay fotos bastante anchas y me cubren la capa de la tabla-miniaturas. He conseguido que esta capa se desplaze según el ancho que adopte el marco, pero se me sale de la pantalla (de la capa contenedor) y la barra de scroll no llega hasta el final de la tabla.
¿Hay alguna forma de hacer, sólo con css, que la capa se desplace pero que el scroll llegue hasta el final? o que cambie de tamaño según el ancho que tenga el marco...
Aquí les dejo el código por si acaso...
.bordes {background-color:#AD9805;}
#ancla{ border:#CCCCCC solid 5px;
position:relative;
top:7%;
height:80%;
width:99%;
}
#marco { border-color:#CCCCCC; border-style:groove; border-width:5px;
margin:25px;
float:left;
}
#contenedora{position:absolute; top:75%; width:100%;}
#contenedor { float:right;
width:773px;
overflow:auto;
}
#contenedor img {width:60px; height:60px; margin:0px;}
y parte del html...
<body>
<div id="ancla">
<div id="marco"> </div>
<div id="contenedor">
<table class="bordes">
<tr>
<td>
<img src="casarbol.jpg" title="casa del árbol" OnClick="mostrar('casadelarbolg.jpg')"/>
</td>
.
.
.
<td>
<img src="hombreton.jpg" title="hombretón" onClick="mostrar('hombretong.jpg')" />
</td>
</tr>
</table>
</div>
</div>
</body>
Espero haberme esplicado bien. He visto que en el foro hay algo parecido a esto, pero creo que no es lo mismo, y no lo ha respondido nadie desde hace un rato...
Muchas gracias por la ayuda.