[CSS] Scrollbar doet vreemd in IE 7

[Wizz15]

Tijdens het uitwerken van een site kwam ik een vaag probleem tegen. Ik heb een div absoluut gepositioneerd, met een vaste hoogte. Daarin staat content met een variabele lengte. Soms krijg je dus een scrollbar en soms niet. In Firefox en IE6 werkt alles goed, maar in IE 7 gaat het mis.

In IE7 lijkt het namelijk alsof IE de lengte van de div niet kan bepalen, waardoor de scrollbar van lengte veranderd wanneer je scrollt (hij begint lang alsof er weinig gescrollt kan worden, maar naarmate je verder scrollt 'ziet' IE dat de div langer is, en wordt de scrollbar kleiner).

Omdat de website waar ik aan werk voor een klant is en nog niet af is kan ik hem niet online laten zien. Wel heb ik een voorbeeld van deze bug (want het schijnt een bug te zijn van IE 7) gevonden: http://www.gtalbot.org/Br...Bugs/InfiniteLoopIE7.html

Er staat echter geen oplossing voor dit probleem bij. Via Google kwam ik wel bij lelijke JavaScript oplossingen uit om toch de hoogte te kunnen bepalen, maar dit bewaar ik liever als allerlaatste oplossing. Het probleem is ook weg als je de DOCTYPE weg haalt, maar dit is voor mij geen optie.

Het probleem lijkt getriggerd te worden door 'overflow:auto' i.c.m. 'position:absolute'. Ik ben aardig bekend met CSS, maar dit is toch wel 'n lastige...

Misschien dat er hier iemand bekend is met een workaround?

PS. De scrollbar zo laten is ook geen optie, ook al is het alleen in IE 7

[Verwijderd]

Ik durf op mijn virtual machine niet te gaan experimenteren gezien:

quote: http://www.gtalbot.org/BrowserBugsSection/MSIE7Bugs/

For some MSIE 7 users, already at this point, the CPU %tage for iexplore.exe process will become maximized and will not return to normal.

Twee gedachten:

Misschien is de oplossing toch te vinden in javascript. Niet door de hoogte te berekenen, maar door onload helemaal naar beneden en dan weer naar boven te scrollen in de div. Doe dat dan natuurlijk wel in een conditional comment, zodat gebruikers die geen IE7 hebben er niet mee lastig gevallen worden, want dit zou natuurlijk wel een beetje een vieze oplossing zijn.

Wat gebeurt er als je overflow-y:scroll gebruikt?

[Wizz15]

overflow-y:scroll zet helaas geen zoden aan de dijk... Die maximized CPU time heb ik overigens geen last van, aangezien hij bij mijn voorbeeld start op 12% en vervolgens weer normaal wordt als je een keer naar beneden hebt gescrollt.

Verder is mijn probleem nog iets raarder dan dat voorbeeld, aangezien het probleem weg is als je eenmaal helemaal naar beneden scrollt bij het voorbeeld. Bij die site waar ik mee bezig ben werkt dit echter niet: zodra ik helemaal omlaag scroll en vervolgens weer naar boven wordt mijn scrollbar weer groter. Als de scrollbar helemaal omhoog gescrollt is begint deze zelfs te knipperen (volgens mij wisselt hij dan constant tussen 2 groottes).

Ik begin overigens te vermoeden dat het te maken heeft met bepaalde CSS van sIFR, aangezien het probleem ook weg is als ik sIFR uitschakel...

sIFR permanent uitschakelen is helaas ook geen optie, vanwege het ontwerp waar ik me aan moet houden en het feit dat dit onze eerste site is waar dit probleem naar voren komt...Terwijl we al vaker sIFR hebben gebruikt in sites en dit nooit eerder problemen opleverde.

[ Voor 14% gewijzigd door Wizz15 op 21-11-2007 09:22 ]

[Verwijderd]

Jammer. Ik zal nog eens diep nadenken of ik iets kan bedenken. Lastig probleem.

Wizz15 schreef op woensdag 21 november 2007 @ 09:17:
Die maximized CPU time heb ik overigens geen last van, aangezien hij bij mijn voorbeeld start op 12% en vervolgens weer normaal wordt als je een keer naar beneden hebt gescrollt.

Misschien waag ik het er dan maar op.

[Wizz15]

*kick

Verder nog iemand suggesties?

[daaan]

De bug op de door jou aangegeven pagina lijkt te komen door de HR voor het afsluiten van de div. Als ik er een BR achter zet, of de HR verwijder is het probleem verholpen. ook als ik de HR een kleinere breedte geef is het klaar. Het scrollen met het scrollwiel blijft wel problemen geven.

Als ik vervolgens overflow op scroll zet, werkt alles wel.

Het lijkt er op dat de HR de breedte van de div overschrijdt, waardoor IE eigenlijk uit de div wil klappen. Het lijkt me ook een erg specifiek probleem, wat niet 123 zonder het exacte voorbeeld is op te lossen.