Div se mueve en IE

Tengo una tabla con dos columnas. La columna de la izquierda tiene algún contenido y un widget div que es el único elemento flotante. Este div se mueve hacia la parte inferior de la página y lleva la columna derecha de la tabla cuando se carga la página. A veces retrocede cuando vuelo algo, parece ser completamente aleatorio.Div se mueve en IE

Parece que el error IE peek-a-boo pero no del todo. Lo intenté position: relative; pero no funciona. ¿Algunas ideas?

Aquí está el html:

<table class="formTable"> 
    <tr> 
     <td class="content_main"> 
      <h1>header</h1> 
      <table> 
       <tr> 
        <td>Content here</td> 
        <td>Content here</td> 
       </tr> 
      </table> 

      <div style="float: left; clear: none; display: block; color: rgb(68, 68, 68); font-weight: normal; font-family: &quot;Trebuchet MS&quot;,&quot;Verdana&quot;,sans-serif; font-size: 14px; line-height: 18px; text-decoration: none; text-align: left; margin: 0px; padding: 10px; height: auto; width: auto; background-image: none; background-color: white; border: 10px solid rgb(204, 204, 204); overflow: auto;" id="widget"> 
       Content 
      </div> 
     </td> 
     <td class="content_right"> 
      <ul> 
       <li>List</li> 
       <li>List</li> 
      </ul> 
     </td> 
    </tr> 
</table>

Y aquí está el css para la tabla:

.content_right { 
    padding-left: 20px; 
    padding-top: 15px; 
    width: 393px; 
} 
.content_main { 
    padding-top: 15px; 
    width: 500px; 
}

Fuente

2012-01-11 yumjen

intente utilizar un script de restablecimiento de css como [restablecimiento de yui2] (http://developer.yahoo.com/yui/reset/) –

No se puede reproducir ... puede cambiar [este violín] (http: // jsfiddle.net/8wytE/) para reproducir lo que experimentas? Tal vez algo en el contenido? –

¿Qué tipo de documento está utilizando para su ejemplo? No puede reproducir. – 8bitjunkie

trabajando muy bien para mí. Si sabes cómo usar divs, evita las tablas.

Fuente

2012-01-11 16:29:01 srijan

 <h1>header</h1> 
     <article>Content here</article> 
     <article>Content here</article> 

     <div id="widget"> 
      Content 
     </div> 
     <ul> 
      <li>List</li> 
      <li>List</li> 
     </ul>

Pruebe HTML de esta manera, y use una hoja de estilo CSS en lugar del blob en línea. Los estándares están hechos por una razón. En este momento, todos los navegadores recientes los admiten, eliminando la necesidad de marcas maliciosas y los 'errores' que causa. Ver http://www.abookapart.com/ para leer el material.

Fuente

2012-01-17 13:36:42 Lennart

Respuesta

Cuestiones relacionadas