Espero que alguien pueda ayudarme aquí. Intenté simplificar mi ejemplo lo mejor que puedo.DIV con desbordamiento: automático y una tabla 100% amplia
Tengo una DIV completamente posicionada, que para este ejemplo he hecho llenar la ventana del navegador. Este div tiene el atributo overflow: auto para proporcionar barras de desplazamiento cuando el contenido es demasiado grande para que aparezca el DIV.
Dentro del DIV tengo una tabla para presentar algunos datos, y su ancho es del 100%.
Cuando el contenido se vuelve demasiado grande verticalmente, espero que la barra de desplazamiento vertical aparezca y la tabla se contraiga horizontalmente ligeramente para acomodar la barra de desplazamiento. Sin embargo, en IE7, lo que sucede es que también aparece la barra de desplazamiento horizontal, a pesar de que todavía hay suficiente espacio horizontalmente para todo el contenido en el div.
Esto es específico de IE - Firefox funciona perfectamente.
Fuente completa a continuación. Cualquier ayuda muy apreciada.
, Tony
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Table sizing bug?</title>
<style>
#maxsize
{
position: absolute;
left: 5px;
right: 5px;
top: 5px;
bottom: 5px;
border: 5px solid silver;
overflow: auto;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div id="maxsize">
<p>This will be fine until such time as the vertical size forces a
vertical scroll bar. At this point I'd expect the table to re-size
to now take into account of the new vertical scroll bar. Instead,
IE7 keeps the table the full size and introduces a horizontal
scroll bar.
</p>
<table width="100%" cellspacing="0" cellpadding="0" border="1">
<tbody>
<tr>
<td>A</td>
<td>B</td>
<td>C</td>
<td>D</td>
<td>E</td>
<td>F</td>
<td>G</td>
<td>H</td>
<td>I</td>
<td>J</td>
<td>K</td>
<td>L</td>
<td>M</td>
<td>N</td>
<td>O</td>
<td>P</td>
<td>Q</td>
<td>R</td>
</tr>
</tbody>
</table>
<p>Resize the browser window vertically so this content doesn't
fit any more</p>
<p>Hello</p><p>Hello</p><p>Hello</p><p>Hello</p><p>Hello</p>
<p>Hello</p><p>Hello</p><p>Hello</p><p>Hello</p><p>Hello</p>
</div>
</form>
</body>
</html>
añadió 03/16/10 ... pensé que podría ser interesante señalar que los puntos de código fuente de GWT a esta pregunta en un comentario ... http://www.google.com/codesearch/p?hl=en#MTQ26449crI/com/google/gwt/user/client/ui/ScrollPanel.java&q=%22hack%20to%20account%20for%20the%22%20scrollpanel&sa=N&cd=1&ct=rc&l=48
Este método suprime las barras de desplazamiento horizontales, pero no vuelve a dibujar el ancho de la tabla interna. Entonces, cuando se muestran las barras de desplazamiento verticales, el borde de la tabla interna se corta. Esto puede o no ser aceptable en su diseño. –