IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

HTML Discussion :

Interprétation CSS avec les nouvelles balises et Firefox [HTML 5]


Sujet :

HTML

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre éclairé Avatar de Sayrus
    Profil pro
    Inscrit en
    Décembre 2005
    Messages
    899
    Détails du profil
    Informations personnelles :
    Âge : 40
    Localisation : Belgique

    Informations forums :
    Inscription : Décembre 2005
    Messages : 899
    Par défaut Interprétation CSS avec les nouvelles balises et Firefox
    Bonjour,

    Je rencontre un problème d'interprétation des CSS sous Firefox notamment mais également sur Opéra. Pas de souci sous Chrome et Safari...

    En effet, il semblerait que sur FF et Opéra, les balises de type "aside", "section", etc. ne soient pas prises en considération pour le rendu CSS...

    Si je remplace par contre, "aside" et "section" par "div", les styles fonctionnent correctement...

    Qu'ai-je loupé? Une idée?

    Merci.

  2. #2
    Membre émérite
    Avatar de gwinyam
    Homme Profil pro
    Développeur Web
    Inscrit en
    Mai 2006
    Messages
    1 162
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 39
    Localisation : France, Paris (Île de France)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Opérateur de télécommunications

    Informations forums :
    Inscription : Mai 2006
    Messages : 1 162
    Par défaut
    T'es sur quelle version de Firefox?

    Je sais qu'ils ont des soucis avec CSS3 et notamment toutes les propriétés qui démarrent par -moz qui n'ont plus lieu d'être. Par exemple les arrondis, FF est le seul à avoir encore ses propres propriétés contrairement à IE (si j'avais imaginé dire ça un jour), Chrome, Safari, etc. Cependant, la nightly build de FF n'a plus ce souci.

    A voir avec cette version donc si ça marche. Si non, je ne peux rien pour toi, désolé

  3. #3
    Membre éclairé Avatar de Sayrus
    Profil pro
    Inscrit en
    Décembre 2005
    Messages
    899
    Détails du profil
    Informations personnelles :
    Âge : 40
    Localisation : Belgique

    Informations forums :
    Inscription : Décembre 2005
    Messages : 899
    Par défaut
    C'est firefox 3.6 que j'utilise... et ça fait le même problème sous Opéra

  4. #4
    Membre émérite
    Avatar de gwinyam
    Homme Profil pro
    Développeur Web
    Inscrit en
    Mai 2006
    Messages
    1 162
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 39
    Localisation : France, Paris (Île de France)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Opérateur de télécommunications

    Informations forums :
    Inscription : Mai 2006
    Messages : 1 162
    Par défaut
    Citation Envoyé par Sayrus Voir le message
    C'est firefox 3.6 que j'utilise... et ça fait le même problème sous Opéra
    T'as regardé si ces balises étaient officielement supportées par ces navigateurs?
    L'implémentation de HTML5 et CSS3 n'est pour le moment complète sur aucun navigateur. Il est possible que tes balises soient dans ce cas. Ou que ce soit réglé dans de prochaines versions comme je l'ai dit dans mon message précédent. Notamment avec la beta de FF4 ou sa nightly build.

  5. #5
    Membre éclairé Avatar de Sayrus
    Profil pro
    Inscrit en
    Décembre 2005
    Messages
    899
    Détails du profil
    Informations personnelles :
    Âge : 40
    Localisation : Belgique

    Informations forums :
    Inscription : Décembre 2005
    Messages : 899
    Par défaut
    J'ai essayé de me renseigner, mais bizarrement, il y a encore peu d'informations sur le HTML5 sur le web... (si il y en a c'est pas ça, mais je veux dire peu de sujets spécifiques à tel ou tel problème...)

    Je vais continuer mes recherches ou tout simplement finir par réutiliser les divs...

  6. #6
    Membre émérite
    Avatar de gwinyam
    Homme Profil pro
    Développeur Web
    Inscrit en
    Mai 2006
    Messages
    1 162
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 39
    Localisation : France, Paris (Île de France)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Opérateur de télécommunications

    Informations forums :
    Inscription : Mai 2006
    Messages : 1 162
    Par défaut
    T'auras un poil plus d'info avec ce site, il test justement la compatibilité de ton navigateur avec HTML 5: http://html5test.com/

    Je viens d'ailleurs de tester IE7, c'est pas glorieux

  7. #7
    Rédacteur
    Avatar de Macmillenium
    Homme Profil pro
    Développeur front-end
    Inscrit en
    Mars 2008
    Messages
    2 333
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 39
    Localisation : France, Paris (Île de France)

    Informations professionnelles :
    Activité : Développeur front-end
    Secteur : High Tech - Produits et services télécom et Internet

    Informations forums :
    Inscription : Mars 2008
    Messages : 2 333
    Par défaut
    Bonjour,

    Citation Envoyé par Sayrus Voir le message
    Si je remplace par contre, "aside" et "section" par "div", les styles fonctionnent correctement...
    C'est parce que l'élément DIV est doté d'un display:block par défaut (via la feuille de style par défaut des navigateurs), contrairement aux nouveaux éléments HTML5 qui ne sont pas encore totalement implémentés sur les principaux navigateurs en circulation et ont donc un rendu inline (la valeur initiale de la propriété display).

    Si tu veux profiter pleinement de ces nouveaux éléments, il te suffit de leur attribuer un display:block dans ta feuille de style et d'utiliser un petit script pour IE8- qui a besoin de construire les éléments qui lui sont inconnus via la méthode createElement()

    Citation Envoyé par gwinyam Voir le message
    Juste une précision: HTML5 n'est pas encore publié en version définitive. C'est pourquoi des pans entiers ne sont pas pris en compte dans l'ensemble des navigateurs.
    Oui mais HTML5 ne deviendra peut-être jamais une recommandation (il faut deux implémentations complète pour cela), c'est la compatibilité des navigateurs avec les nouvelles fonctionnalités HTML5 qui nous intéresse
    A titre d'exemple, CSS2.1 n'est pas encore publié en "version définitive" et pourtant on a commencé à l'utiliser depuis longtemps en fonction des implémentations sur les navigateurs.

  8. #8
    Membre émérite
    Avatar de gwinyam
    Homme Profil pro
    Développeur Web
    Inscrit en
    Mai 2006
    Messages
    1 162
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 39
    Localisation : France, Paris (Île de France)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Opérateur de télécommunications

    Informations forums :
    Inscription : Mai 2006
    Messages : 1 162
    Par défaut
    Citation Envoyé par Macmillenium Voir le message
    A titre d'exemple, CSS2.1 n'est pas encore publié en "version définitive" et pourtant on a commencé à l'utiliser depuis longtemps en fonction des implémentations sur les navigateurs.
    Ah merci de l'info, toujours bon à savoir

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Réponses: 19
    Dernier message: 20/03/2010, 14h27
  2. Pb de javascript et css avec les facelets
    Par kam81 dans le forum JSF
    Réponses: 2
    Dernier message: 08/06/2009, 23h14
  3. Réponses: 1
    Dernier message: 04/06/2009, 13h51
  4. Réponses: 18
    Dernier message: 17/03/2009, 17h25
  5. probleme avec les navigateur IE et firefox
    Par jeanfrancois dans le forum Firefox
    Réponses: 10
    Dernier message: 21/03/2007, 09h01

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo