IE CSS Bug - Hoe kan ek in stand te hou 'n posisie: absolute wanneer dinamiese javascript inhoud op die bladsy verander

Question

Ek het 'n bladsy waar daar is 'n kolom en 'n inhoud div, ietwat soos volg:

<div id="container">
    <div id="content">blahblahblah</div>
    <div id="column"> </div>
</div>

Met 'n bietjie stilering het ek 'n beeld wat verdeel tussen die kolom en die inhoud, maar moet dieselfde vertikale posisie in stand te hou sodat dit in lyn is.

Styling is soortgelyk aan dié:

#column 
{
    width:150px;
    height:450px;
    left:-150px;
    bottom:-140px;
    background:url(../images/image.png) no-repeat;
    position:absolute;
    z-index:1;
}

#container 
{
   background:transparent url(../images/container.png) no-repeat scroll left bottom;
   position:relative;
   width:100px;
}

Dit werk baie goed wanneer inhoud in #content dinamies voor lewering gelaai. Dit werk ook baie goed in Firefox altyd. Maar in IE6 en IE7 as ek gebruik JavaScript om die inhoud (en dus hoogte) van #content verander, die beelde nie meer in lyn (#column beweeg nie). As ek gebruik IE Ontwikkelaars Bar om net by te werk die div (sê voeg posisie: absolute hand). Die beeld spring af en lyne weer

Is daar iets wat ek hier ontbreek?

@Ricky - Hmm, wat beteken in hierdie geval is daar geen oplossing dink ek. Op sy beste sal daar 'n jaggedy matchup wees daarna maar as my inhoud brei en kontrakte ens wegkruip / wys nie uitwerk praktiese te wees. Nog dankie vir die beantwoording van die beste oplossing.

Answer 1

Dit is 'n fout in die lewering enjin. Ek loop in dit al die tyd. Een moontlike manier om dit op te los, is om weg te steek en wys die div wanneer jy die inhoud te verander (wat op sy beurt verander die hoogte):

var divCol = document.getElementById('column');
divCol.style.display = 'none';
divCol.style.display = 'block';

Hopelik dit gebeur vinnig genoeg dat dit nie opvallend:)

Answer 2

Nog 'n tydelike oplossing wat vir my gewerk het en het geen flikkerende effek was om by te voeg en te verwyder 'n dummy CSS klas naam, soos dit met behulp van jQuery:

$(element).toggleClass('damn-you-ie')

Answer 3

As jy bekommerd is oor die manier waarop 'n flikker vertoon en wegsteek divCol jy kan 'n ander css eiendom ajust en dit sal dieselfde effek hê Bv.

var divCol = document.getElementById('column');
divCol.style.zoom = '1';
divCol.style.zoom = '';