Pagina con dos marcos

[gmaciel]

Que tal, felices fiestas !!!

Verán, utilizo front page y he creado una página con dos marcos, superior e inferior.

En el superior he puesto un banner y un menú y en el inferior se despliega lo que se elija en el menú.

El problema es que en el marco inferior aparece la barra de desplazamiento vertical y en el superior no. Esto provoca que lo del marco superior no quede alineado a lo del marco inferior porque la barra de desplazamiento mueve el contenido a la izquierda.

Alguna sugerencia??

Salduos y gracias de antemano

GM

[ludovico2000]

Pues yo creo que lo mejor sería que le pusieras al marco inferior que muestre siempre la barra y que diseñes en consecuencia. No es la opción más limpia, pero sí la más "barata" en tiempo y dedicación, ya que sólo tienes que cambiar un poco tu cabecera.

otra opción es modificar el estilo de la barra de desplazamiento con css para que se integre en tu diseño.

también puedes procurar que en el marco inferior no se acumule tanto contenido como para necesitar la barra, departamentalizando la información que contiene.

[elbar]

Cual es la url de la pagina?
O esta en local?

[gmaciel]

Gracias a ambos por responder.

ludovico2000: si, la barra de desplazamiento a la derecha la debo tener, es necesaria, mi idea no es que no aparezca, al contrario, el problema es que el contenido de los marcos superior e izquierdo miden lo mismo de ancho, pero como el marco inferior tiene la barra de desplazamiento, entonces ya no se alinea con el contenido del marco superior.

Cabe aclarar que la página se centra.

elbar: lo siento, pero la página apenas la estoy haciendo, sólo está en disco.

Saludos

GM

[ludovico2000]

Pues entonces intégrala en el diseño cambiando su aspecto y reordenando el marco superior de forma que deje a la derecha el hueco equivalente a la barra y se alinee el contenido "real" con el resto del espacio.

[gmaciel]

Si, eso, pero como??

[ludovico2000]

vamos por partes:

Tienes que hacer dos cosas:

1.- Integrar la barra en tu diseño. Para esto, vamos a cambiar el aspecto de la barra de desplazamiento o scroll.

Iniciado por faq 165 desarrolloweb; por Christian Santalucía en 2002

Hola,
Aquí te dejo lo que tienes que poner en la cabecera de cada página.
<style>
body {
scrollbar-face-color: #A28D68;
scrollbar-shadow-color: #000000;
scrollbar-highlight-color: #000000;
scrollbar-3dlight-color: #000000;
scrollbar-darkshadow-color: #000000;
scrollbar-track-color: #A28D68;
scrollbar-arrow-color: #000000; }
</style>
Solo te falta ponerle los colores que quieras.
Nota: esto sólo funciona en Internet Explorer.

Vale, con esto, pones los colores que queden bien con tu diseño; y antes de ir al segundo paso, vamos a curarnos en salud:

Vamos a hacer que el inferior SIEMPRE saque la barra aunque no sea necesaria, no sea que alguna pág no la saque y tengamos el mismo problema "al revés":

Para ello le ponemos en la página que contiene los marcos, en la línea del marco inferior:

<frame name="loquesea" src="mipag.htm" scrolling="yes">

Y ahora ya vamos al segundo paso propiamente dicho:

2.- Desplazar el marco superior para que encaje con el diseño del inferior.
Para esto, aunque hay a quien no le gusten, voy a proponerte usar tablas: (también se puede hacer con capas div)

Vemos que la barra ocupa 18 px de ancho, así que vamos a hacer una tabla con una fila y dos columnas, es decir, una tabla con dos celdas, y a la primera le daremos ese espacio, y a la segunda "el resto":

<table border="0" width="100%">
<tr>
<td>A</td>
<td width="18px">B</td>
</tr>
</table>

En la celda "A" pondremos todo lo que tienes ahora en el menú, que como será mucho, vamos a ponerlo con un poco de orden:

<table border="0" width="100%">
<tr>
<td>
<!-- COMIENZA EL CONTENIDO -->
Aqui todo lo que ahora tienes dentro del body de la página del marco superior
<!-- TERMINA EL CONTENIDO -->
</td>
<td width="18px">B</td>
</tr>
</table>

En la celda "B" pondremos un espacio en blanco &nbsp;, ya que estará vacía, será el espacio justo sobre la barra del marco inferior. Conviene que le pongas un color adecuado:

<table border="0" width="100%">
<tr>
<td>

<!-- COMIENZA EL CONTENIDO -->
...
<!-- TERMINA EL CONTENIDO -->

</td>
<td width="18px" bgcolor="#00FF00">&nbsp;</td>
</tr>
</table>

Ahora bien, para evitar problemas, es interesante que indiques en esta página que no deje márgenes, poniendo en el body lo siguiente:

<body ... topmargin="0" leftmargin="0">

Creo que esto es todo, si tienes alguna dificultad o no funciona, dime y lo reviso.