El elemento no aparece en IE7 hasta que lo edite mediante Developer Toolbar

Question

Este me tiene perplejo: tengo un elemento en mi página con una posición absoluta, dentro de un contenedor con una posición relativa. En todos los navegadores excepto IE7, aparece en el lugar correcto sin problemas.

En Internet Explorer 7, el elemento no aparece hasta que añadir o editar cualquiera de sus propiedades CSS en la ficha Atributos de la barra de herramientas de desarrollador (incluso propiedades que no tienen nada que ver con su visibilidad o la posición, como color) . Una vez que lo hago, aparece correctamente, e incluso permanece visible si elimino la propiedad que acabo de agregar (¡o deshago la modificación)!

Esto debe ser un error de pantalla específico de IE7, pero no puedo encontrar una manera de evitarlo - He lanzado float, zoom, etc. en vano.

Answer 1

Lo arreglé moviendo el elemento que desaparecía un nivel más profundo, a otro elemento secundario. Como el elemento secundario está flotante, pero no tiene una posición, el elemento que desaparece sigue estando en relación con el elemento principal, que es lo que quiero, pero por alguna razón esto también lo hace visible en IE7, como se supone que debe ser.

Esto es lo que tenía que causó el elemento a desaparecer (no el verdadero IDS):

<div id="parent" style="position: relative;"> 
    <div id="disappear" style="position: absolute; left: -8px; top: -17px;>This element disappears</div> 
</div> 

Esto es lo que hace que parezca:

<div id="parent" style="position: relative;"> 
    <div id="child" style="float: left; width: 340px;"> 
    <div id="disappear" style="position: absolute; left: -8px; top: -17px;">Now this element appears</div> 
    </div> 
</div> 

flotante #parent y dándole un width (las mismas dos propiedades que tiene #child) no funcionó, sin embargo, tengo que usar un elemento hijo por separado. ¡Totalmente extraño, pero imaginé que publicaría esto en caso de que alguien más se encuentre con el mismo problema!

Answer 2

¿No es extraño cómo la barra de herramientas de desarrollador IE lo hace visible?

Lo arreglé en lugar de usar el posicionamiento absoluto para el elemento secundario usando el posicionamiento relativo con un margen negativo, a la izquierda para colocar el elemento. No es ideal ya que hace que el diseño sea más frágil, pero mi única opción en ese momento.