Version complète: sur le forum Webmaster Hub : Masquer un bug sous Opéra
Webmaster Hub > Création et exploitation de Sites Internet > Les langages du Net > (X)HTML et CSS
shangailily
Bonjour à tous,

J'utilise "display:table-cell;height:100%;" pour forcer les colonnes à occuper toute la hauteur du contenu. Cela marche bien avec IE, Mozilla. En revanche avec Opéra, il apparaît un petit bug provoqué par la présence de "display:table-cell". Si je l'enlève, Opera ne rencontre plus de bug mais c'est Mozilla qui rencontre un bug.
Je cherche un hack qui force Opera à ne pas lire "display:table-cell" comme si cette propriété n'était pas visible, c'est possible de faire cela ?

Merci d'avance.
Light_at_the_end
Salut

Ya til du php dans ton site ?

Je te donne l'ex (si tu as le php)

Tu mets ca avant le code de ton style (que tu extrait de ta CSS) :

CODE
if (!eregi('opera', $HTTP_USER_AGENT)) {
//tu affiches ton style
}


Il détectera le navigateur et si c opera il ne mettra pas le style

smile.gif
shangailily
Hélàs pas de php wacko.gif
Light_at_the_end
Alors je doute que ce soit possible :nono:
Nissone
J'ai moi aussi eu un problème avec Opera, que j'ai soumis dans une discussion à propos d'Opera.

J'ai réussi à résoudre mon problème grâce à un lien qui m'avait été donné : Opera, il flotte pas. Il utilise la combinaison du *7 hack et du Tantek hack pour cacher des infos à Opera (et à IE, d'où le Tantek hack pour redonner l'info à IE)

J'espère que cela t'aidera wink.gif
shangailily
Merci Nissone,

Je ne connaissais pas l'astuce pour cacher à Opera. Je comprends mieux pourquoi certains sites utilisaient ce jargon pour tricher...

Malheureusement, je n'ai résolu mon problème avec :
CODE
#contenuCentral{width:100%;display:table-cell;height:100%;background-color: #000;margin:0px;padding:0px;}
html*#contenuCentral  {display:table-cell;}/* cette régle est cachée pour Opera*/

mais je me dis qu'il ne faut pas être trop perfectionniste et que le bug nest pas trop disgrâcieux, c'est ce qui compte.
Nissone
CITATION(shangailily @ mardi 28 juin 2005, 11h52)
CODE
#contenuCentral{width:100%;display:table-cell;height:100%;background-color: #000;margin:0px;padding:0px;}
html*#contenuCentral  {display:table-cell;}/* cette régle est cachée pour Opera*/

*


Pour l'instant, ta première ligne indique à tous les navigateurs display:table-cell et ta deuxième ligne indique à tous tes navigateurs sauf Opera display:table-cell wacko.gif

- Il faut que, dans la première ligne, tu indiques, en premier, ce que tu veux que tous les navigateurs sauf Opera appliquent.
- Tu places voice-family: "\"}\""; voice-family:inherit; après.
- Puis la valeur que Opera doit appliquer.
Tous les navigateurs sauf IE vont appliquer cette nouvelle régle, tu dois donc faire la deuxième ligne.

- Dans ta deuxième ligne, tu indiques, à nouveau, ce que tu veux que tous les navigateurs affichent.

Si mes explications ne sont pas claires, relis le tutoriel ; c'est très bien expliqué smile.gif
shangailily
Alors, j'ai ajouté ceci :
CODE
#contenuCentral{width:100%;display:table-cell;voice-family: "\"}\""; voice-family:inherit;display:block;height:100%;background-color: #000;margin:0px;padding:0px;}
html*#contenuCentral  {display:table-cell;}/* cette régle est cachée pour Opera*/

Mais le pb est que sous Mozilla, cela ne marche plus, sous Opera, c'est impeccable. En fait, je ne sais pas trop quoi dire après "inhérit", j'ai mis "display:block" car c'est par défaut...
Bizarre que cela ne marche pas avec Mozilla le hack d'Opera...
Nissone
Attention à ne pas mettre derrière le voice-family: "\"}\""; voice-family:inherit; des informations que tu veux qu'IE voit !

Sinon, j'ai eu l'occasion de tester ce hack la semaine dernière et je n'ai pas eu de problème avec Mozilla.
Est-il possible que ton problème vienne d'ailleurs ? Une autre interprétation du table-cell par Mozilla ou autre chose...
shangailily
Oui peut-être que le problème vient d'ailleurs, je ne sais pas trop, il faut que je regarde à nouveau sad.gif(

Merci Nissone
Ceci est une version "bas débit" de notre forum. Pour voir la version complète avec plus d'information, la mise en page et les images, veuillez cliquer ici.