Tekst blir borte i IE ved bruk av float:left

[Runar]

Jeg fulgte en guide for å få gjennomsiktige PNG bilder, både normale bilder () og i bakgrunner på

elementer, og det virker.

Men hvis det er tekst over div'en som har et gjennomsiktig PNG bilde som bakgrunn, blir teksten borte.

 

Noen som har vært borti dette problemet?

 

Edit: Problemet kommer tydeligvis av at jeg har float:left på det elementet som også har gjennomsiktig PNG bakgrunn.

 

Edit2: Teksten blir borte fordi jeg har float:left på elementene. Det har ikke noe å si om de har PNG bakgrunn eller ikke. Løsning?

Endret 25. februar 2007 av Runar

[Magnus Holm]

Såklart vil vi se både guide og iepngfix.htc

[Runar]

Edit: Problemet kommer tydeligvis av at jeg har float:left på det elementet som også har gjennomsiktig PNG bakgrunn.

 

Guiden var så simpel at jeg skriver den på nytt:

 

1) Last ned denne filen (iepngfix.htc) og plasser den der du vil.

 

2) Legg til følgende kode i CSS filen din:

img, div#name {
 behavior: url( 'iepngfix.htc' );
}

 

3) Bytt ut div#name med alle div elementene dine som har PNG bakgrunner.

 

4) Lag en gjennomsiktig GIF bilde, og plasser det i samme mappe som iepngfix.htc

 

Tror dette var det hele.

 

Det fungerer helt perfekt, så lenge det ikke er tekst over div'en med gjennomsiktig PNG bakgrunn.

Endret 25. februar 2007 av Runar

[Anders Moen]

Hvorfor ikke bare bruke .gif i stedet for .png?

[Runar]

Fordi det blir hakkete i kantene (runde hjørner) når jeg har det over en gradient (er det et norsk ord for dette?) bakgrunn.

 

Edit: Ser ut som det gikk litt fort når jeg lagde tråden. Problemet kan kortes ned til én setning:

 

Tekst mellom et element som har position:relative og et annet som har float:left/right blir borte i IE.

Endret 25. februar 2007 av Runar