2011-09-14 38 views
11

Estoy viendo un comportamiento extraño con un DIV de desplazamiento en IE9. Estoy usando la etiqueta CSS de altura máxima en el DIV. El DIV se hace más alto cuando ingreso texto en los cuadros de entrada contenidos en el DIV. Esto solo ocurre cuando los cuadros de entrada se extienden más allá del borde derecho de la página.Problema con DIV de desplazamiento de altura máxima en IE9

Para recrear, reducir el navegador para que los cuadros de entrada se extiendan más allá del borde derecho de la pantalla y las barras de desplazamiento horizontales aparezcan en el DIV. Luego ingrese texto en cualquiera de los cuadros de entrada. El DIV se hace más alto con cada pulsación de tecla.

¿He echado a perder mi CSS o HTML, o es esto un error con IE9?

Gracias.

<head> 
<style type="text/css"> 
.ScrollTest 
{ 
    max-height: 200px; 
    overflow:auto; 
} 
</style> 
</head> 
<body> 
<div class="ScrollTest"> 
    <table class="ScrollTest"> 
     <tr> 
      <td><input /></td> 
      <td><input /></td> 
      <td><input /></td> 
      <td><input /></td> 
      <td><input /></td> 
      <td><input /></td> 
      <td><input /></td> 
     </tr> 
    </table> 
</div> 
<div>Second DIV</div> 
</body> 
</html> 
+0

Esto es muy extraño! Siendo curioso por la solución. – NGLN

+0

En vivo: http://jsbin.com/ifirur (no se olvide de abrir con IE9 – Mohsen

+0

IE10 está bien para mí. Pero IE9 es lo que OP dice – Mohsen

Respuesta

7

Parece ser un error, no hay ninguna razón para este comportamiento. Podría solucionar el problema reemplazando overflow:auto con overflow-x:scroll.

Echale un vistazo: http://jsbin.com/ifirur/4

+0

Gracias por confirmar que es un error. – SkipHarris

+0

gracias !! funcionó !! – Davsket

+0

'ovefflow: hidden;' funciona también – Kinka

Cuestiones relacionadas