petit souci CSS avec FF !?

[HP]

bon j'accuse personne mais je teste une nouvelle interface sous IE et Firefox
je voulais une zone prévisualisation en "pseudo" frame (faut dire que les overflox ça ressemble à s'y méprendre, et hop, je me dis un backround fixe, ça serait sympa :

Code : Tout sélectionner

/*Preview*/
#Previewframe {
   padding : 0.5em;
   margin: 0 0 1.5em 0;
   height: 14em;
   overflow: auto;
   background: #FFFFFF url(img/preview.png) fixed no-repeat top left;
   border: 1px solid #006699;
}

on doit donc avoir une petite image signifiant que cette fausse frame contient un aperçu (parce que y a quand même 3 "fausses frames" sur la même page)
et ça marche sous IE (inouïe, enfin moi je m'y attendais pas) et pas sous Firefox ... pourquoi ?

[HP]

j'ai voulu faire "trop bien", y a pas besoin du fixed sous Firefox pour que l'image garde sa place pendant le scroll ...
si j'enlève le fixed, ça marche plus sous IE au moment du scroll.

Voilà, voilà ...
j'arrête le CSS pour aujourd'hui ...

[FF_Olivier]

Essaie ceci :

Code : Tout sélectionner

<div id="previewBackground">
  <div id="previewText">
    <p>bla bla bla</p>
  </div>
</div>

Code : Tout sélectionner

#previewBackground {
  margin: 0 0 1.5em 0;
  border: 1px solid #006699; 
  height: 14em;
  overflow: auto;
  background: #FFFFFF url(img/preview.png) no-repeat top left;
}
#previewText {
  padding : 0.5em;
}

En consacrant une <div> au fond et l'autre au texte, ça devrait aller car plus besoin de fixed.

[HP]

j'essaierai ...
mais imbriquer 2 divs juste pour aider IE !? je sais pas ...

[FF_Olivier]

Euh, en effet, je viens d'essayer, ça ne marche pas, dans IE, désolé
Pourtant, j'avais vu une méthode il n'y a pas longtemps, je vais chercher encore un peu.

[HP]

Pourtant, j'avais vu une méthode il n'y a pas longtemps, je vais chercher encore un peu.

sinon, laisse tomber IE,
je verrai si mon CSS passe bien dans Opéra,
mais comme c'est une zone d'administration, ça me fait traîner les pieds

[EDIT]
ça passe dans Opéra ...
l'image de fond accompagne bien le scroll (sans avoir besoin du fixed)


Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.1) Gecko/20060111 Firefox/1.5.0.1

[FF_Olivier]

Voilà, j'ai ! Ca marche sous FF et sous IE (pour Opera, je ne sais pas) :

Code : Tout sélectionner

#previewBackground {
  height: 14em;
  margin: 0 0 1.5em 0;
  border: 1px solid #006699;
  background: #FFFFFF url(img/preview.png) no-repeat top left;
}
#previewFlow {
  height: 14em;
  overflow: auto;
}
#previewText {
  padding : 0.5em;
}

Code : Tout sélectionner

<div id="previewBackground">
  <div id="previewFlow">
    <div id="previewText">
      <p>Un très long paragraphe</p>
    </div>
  </div>
</div>

C'est en fait 3 <div> qu'il faut imbriquer. Je sais, c'est lourd mais ça marche !