Scroll horizontal en DIV: imposible

fga05 · #1 (**permalink**) 23/07/2008, 09:39

Hola:

Tengo un DIV (incluye una tabla) que muestra scroll vertical al reducir la altura de la página (una vez la tabla se queda sin espacio), sin embargo no muestra el scroll horizontal al reducir el ancho, nunca.

Alguien sabría el xq de esta diferencia de comportamiento. Sé que con un iframe se mostrarían ambos scroll, xo no me sirve la opción del iframe.

Os adjunto el código.

Gracias de antemano.

Código:


<HTML>    
<HEAD>
	<TITLE>Prueba redimensionamiento y organización tablas</TITLE>
</HEAD>      
<BODY scroll="no" style="margin:0px">
	<TABLE height="100%" width="100%" border="0" cellpadding="0" cellspacing="0">  
		<TR>
			<TD height="25px" width="100%" bgcolor="red">fila superior</TD>
		</TR>
		<TR>
			<TD height="*" width="100%" bgcolor="white">
				<TABLE height="100%" width="100%" border="0" cellpadding="0" cellspacing="0">  
					<TR>
						<TD height="100%" width="210px" bgcolor="green">
							<DIV align="center" bgcolor="pink" style="overflow:auto; height:100%; width:100%;">
									menuuuuuuuuuuuuuuuuuuuuuu
							</DIV>
						</TD>
						<TD height="100%" width="*">
							<TABLE height="100%" width="100%" align="center" border="0" cellpadding="10" cellspacing="0"> 
								<TR>
									<TD height="80%" width="100%" align="right" valign="top">                                                       
										<DIV align="center" bgcolor="pink" style="overflow:auto; height:100%; width:100%;">
											<TABLE width="100%" bgcolor="red" border="1" cellpadding="0" cellspacing="0">  
												<TR>
													<TD>columna_1111111111111111111111</TD>
													<TD>columna_2222222222222222222222</TD>
													<TD>columna_3333333333333333333333</TD>
												</TR>
												<TR>
													<TD>columna_1</TD>
													<TD>columna_2</TD>
													<TD>columna_3</TD>
												</TR>
												<TR>
													<TD>columna_1</TD>
													<TD>columna_2</TD>
													<TD>columna_3</TD>
												</TR>
												<TR>
													<TD>columna_1</TD>
													<TD>columna_2</TD>
													<TD>columna_3</TD>
												</TR>
											</TABLE>  										
										</DIV>
									</TD>
								</TR>
							</TABLE>
						</TD>
					</TR>
				</TABLE>
			</TD>
		</TR>
	</TABLE>  
</BODY>
</HTML>