Absolute Positioning ikke virker i mitt IE7

Absolute Positioning ikke virker i mitt IE7


Internet Explorer 6 og 7 er beryktet for sin flekkete gjengivelse av CSS-elementer. Vanligvis kommer dette i form av uvanlige feil som er vanskelig å gjenskape, langt mindre å fikse. En bug innebærer absolutt plasserte elementer forsvinner tilfeldig. Du kan fikse denne feilen, men den enkleste løsningen innebærer en slurvete bruk av divs.

Inkonsistent-Viste Elements

Feilen produserer inkonsistente effekter. Når den er aktiv, hele divs, avsnitt, bilder og andre elementer forsvinner. Når det er inaktiv, disse elementene vises normalt. Dette inkonsekvent effekten kan gjøre feilen vanskelig å gjenskape og rette. For å teste problemet ved å bruke en ekte versjon av Internet Explorer 7 i motsetning til en tester som IETester, som feilen er mest sannsynlig til å vises når du bruker Internet Explorer selv.

Flytende Elements Beside Absolute Elements

Feilen vises når du legger inn en absolutt posisjonert div ved siden av en flytende div. Ifølge Sitepoint Craig Butler, er dens inkonsekvens resultatet av timing. Dersom siden lastes raskt, så feilen er mindre sannsynlig å manifestere. Jo lenger tid det tar for en side å gjengi innholdet, jo mer sannsynlig er det å se feilen dukker opp.

div Buffere

Siden feilen er forårsaket av absolutte divs berøre flytende divs, er den åpenbare løsningen for å skille de to av dem. Plasser en ny div i mellom, og ikke tilordne den en posisjon. Det vil virke som en buffer og beskytte den helt plassert div. Den resulterende koden er ikke rent eller pen, men det får jobben gjort.

Redesign Din Layout

Hvis du ønsker å holde koden din ren, kan du også løse feilen ved å endre nettstedets layout. Gjør hva endringer er nødvendig for å hindre flytende og absolutte divs fra å berøre hverandre. Detaljene i denne prosedyren helt avhengig av den gjeldende layout. Hvis du er heldig, kan du bare overfører absolutte divs til flytende seg eller vice versa. Ellers må du ty til mer tidkrevende løsninger, for eksempel endre rekkefølgen dine divs.