div display:none

Discussion dans 'Développement d'un site Web ou d'une appli mobile' créé par toto2525, 18 Mai 2011.

  1. toto2525
    toto2525 WRInaute occasionnel
    Inscrit:
    20 Septembre 2007
    Messages:
    342
    J'aime reçus:
    0
    Salut,

    J'ai un souci avec Internet Explorer 8 et 9, lorque je clique sur un bouton radio une div apparait juste en dessous et dans cette div il y a un block avec une bordure aux coins arrondis, avec Internet Explorer 6 et 7 + Firefox pas de soucis ma bordure aux coins arrondis est visible mais avec Internet Explorer 8 et 9 la bordure de ma div n'apparait pas (je vois le contenu de ma div mais pas la bordure), je pige pas pourquoi ?

    J'utilise ce code css pour mettre en forme ma bordure arrondie :
    Code:
    .arrondi{-moz-border-radius: 10px;-webkit-border-radius: 10px;border-radius: 10px;background: #FFFFFF;border: solid #C0C0C0 1px;font-size:65%;padding: 5px;margin: 3px;behavior: url("../scripts/PIE.htc");}
    
    Et j'insère ce code dans mon code html :
    Code:
    <!--[if lte IE 8]><script type="text/javascript" src="../scripts/roundies.js"></script><![endif]-->
    
    Merci pour votre aide.
     
  2. Force Referencement
    Force Referencement WRInaute discret
    Inscrit:
    26 Mars 2011
    Messages:
    73
    J'aime reçus:
    0
    Tu dois avoir une erreur 404 avec ton fichier js.

    Le mieux c'est d'avoir
    Code:
    src="http://www.monsite.com/scripts/roundies.js"
     
  3. toto2525
    toto2525 WRInaute occasionnel
    Inscrit:
    20 Septembre 2007
    Messages:
    342
    J'aime reçus:
    0
    Merci pour ta réponse, j'ai essayé en ajoutant mon url devant le /scripts/roundies.js mais ça ne change rien, la bordure ne s'affiche toujours pas avec IE 8 et 9 :?
     
  4. Force Referencement
    Force Referencement WRInaute discret
    Inscrit:
    26 Mars 2011
    Messages:
    73
    J'aime reçus:
    0
    Est-ce que tu as réussi à le faire fonctionner en local du genre : sur ton bureau index.html avec ton js à côté

    Est-ce que tu appelles bien la classe arrondi ?
     
  5. toto2525
    toto2525 WRInaute occasionnel
    Inscrit:
    20 Septembre 2007
    Messages:
    342
    J'aime reçus:
    0
    Je ne pense pas que ce soit un problème d'insertion de ma classe arrondi ou de mon fichier js car ça marche parfaitement avec Internet Explorer 6 et 7 et avec Firefox mais ça bug avec Internet Explorer 8 et 9, c'est donc plus un souci avec ces 2 IE (8 et9), mais comment corriger ce bug avec IE 8 et 9 ?
     
  6. Amauri
    Amauri WRInaute occasionnel
    Inscrit:
    7 Avril 2011
    Messages:
    314
    J'aime reçus:
    0
    Enlever la condition "< ie8" dans ce cas

    Code:
    <!--[if IE]>
    et pas

    Code:
    <!--[if lte IE 8]>
     
  7. toto2525
    toto2525 WRInaute occasionnel
    Inscrit:
    20 Septembre 2007
    Messages:
    342
    J'aime reçus:
    0
    J'ai mis "if IE" mais c'est toujours pareil, la bordure s'affiche pas avec IE 8 et 9 :?
     
  8. Amauri
    Amauri WRInaute occasionnel
    Inscrit:
    7 Avril 2011
    Messages:
    314
    J'aime reçus:
    0
    Dans le CSS la taille de la bordure doit être spécifié en premier, je ne sais pas si ça peut venir de là

    Code:
    border:1px solid #C0C0C0;
     
  9. toto2525
    toto2525 WRInaute occasionnel
    Inscrit:
    20 Septembre 2007
    Messages:
    342
    J'aime reçus:
    0
    A priori IE 8 et 9 bug un peu avec roundies http://www.dillerdesign.com/experiment/DD_roundies/#supported_browsers je pense que le problème vient de là, mais ce que je ne comprends pas c'est que j'ai une div qui est toujours visible avec une bordure arrondie qui utilise le js roundies et elle s'affiche correctement avec IE 8 c'est uniquement la bordure arrondie qui est dans ma div cachée qui ne s'achiffe pas dans IE 8 et 9 quand je l'affiche en cliquant sur mon bouton radio :(

    Connaissez-vous une méthode avec du css (sans image) pour faire des bordure arrondies et qui soit supporté par la majorité des browers ?
     
  10. Force Referencement
    Force Referencement WRInaute discret
    Inscrit:
    26 Mars 2011
    Messages:
    73
    J'aime reçus:
    0
    Pourquoi sans image ?
     
  11. toto2525
    toto2525 WRInaute occasionnel
    Inscrit:
    20 Septembre 2007
    Messages:
    342
    J'aime reçus:
    0
    J'ai trouvé :) il fallait remettre cette ligne :
    Code:
    <!--[if IE]><script type="text/javascript" src="../scripts/roundies.js"></script><![endif]-->
    
    dans ma div cachée, comme cela :
    Code:
    <div id="ma_div" style="display: none">
    <!--[if IE]><script type="text/javascript" src="../scripts/roundies.js"></script><![endif]-->
    </div>
    
    et là ma bordure arrondie s'affiche correctement dans ma div cachée :D
     
  12. toto2525
    toto2525 WRInaute occasionnel
    Inscrit:
    20 Septembre 2007
    Messages:
    342
    J'aime reçus:
    0
    J'ai crié victoire trop vite :( lorsque je clique sur mon bouton radio tout de suite après le chargement de ma page la bordure arrondie dans ma div cachée s'affiche une fois sur deux, mais lorsque j'attends plus longtemps après le chargement de ma page la bordure ne s'affiche jamais, quelqu'un y comprend quelque chose :eek:
     
  13. toto2525
    toto2525 WRInaute occasionnel
    Inscrit:
    20 Septembre 2007
    Messages:
    342
    J'aime reçus:
    0
    J'ai testé avec Firefox, Chrome, Safari, IE 6 et 7 => ça marche parfaitement avec tous ces navigateurs mais ça bug avec IE 8 et 9.... punaise.... ça fou les boules quand on sait que +/- 50% de mes visiteurs utilisent IE je ne peux pas faire l'impasse sur ces 2 browsers... avez-vous une idée pour corriger ce bug d'affichage avec IE 8 et 9 ?
     
  14. floutchito
    floutchito Nouveau WRInaute
    Inscrit:
    16 Octobre 2011
    Messages:
    1
    J'aime reçus:
    0
    Bonjour,

    La solution est de donner un z-index (et donc une position, c'est une condition de fonctionnement du z-index) à l'élément. C'est un bug de PIE.htc avec IE8.

    Code:
    .arrondi{
         -moz-border-radius: 10px;
         -webkit-border-radius: 10px;
         border-radius: 10px;
         background: #FFFFFF;
         border: solid #C0C0C0 1px;
         font-size:65%;
         padding: 5px;
         margin: 3px;
         position: relative;
         z-index: 10;
         behavior: url("../scripts/PIE.htc");
    }
    Donnez une valeur de z-index supérieure à l'élément situé en dessous de celui qui est stylé.
    La valeur de position peut aussi être adaptée en fonction du style souhaité. En sachant que seules les valeurs "relative", "absolute", et "fixed" donnent la possiblité d'utiliser z-index.

    Cordialement.
     
Chargement...
Similar Threads - div display none Forum Date
Div display none mobile Développement d'un site Web ou d'une appli mobile 2 Juin 2017
Googlebot crawle-t-il les onglets d'une div en style="display:none" ? Crawl et indexation Google, sitemaps 26 Août 2014
Div en style="display: none" et référencement Crawl et indexation Google, sitemaps 12 Septembre 2011
Div avec display:none & référencement Débuter en référencement 15 Février 2010
Conséquences de l'emploi de <div display:none >... Problèmes de référencement spécifiques à vos sites 27 Mars 2008
<div> genant ? en display:none ? Débuter en référencement 16 Octobre 2007
Mettre des keywords dans un div display: none Référencement Google 11 Septembre 2006
balise <DIV style="DISPLAY: none"> Problèmes de référencement spécifiques à vos sites 18 Août 2005
Les DIV avec style visibility : hidden & display = none Débuter en référencement 11 Juin 2005
[Résolu] Backlink en div : display:none valide ? Référencement Google 27 Avril 2005
Ajouter style="display: block;" dans une div Développement d'un site Web ou d'une appli mobile 8 Janvier 2020
[CSS] Aligner une image à coté d'une div en display:table-cell ? Développement d'un site Web ou d'une appli mobile 2 Mai 2012
Comment masquer une div qui rencontre une autre div Développement d'un site Web ou d'une appli mobile 16 Janvier 2022
Divers problèmes de Google Crawl et indexation Google, sitemaps 29 Novembre 2020
Contenu non visible de l'internaute ( Tab Div) & SEO Rédaction web et référencement 23 Mars 2020
Masquer une div si Internet Explorer Développement d'un site Web ou d'une appli mobile 14 Décembre 2019
Liens de diversité : la langue VS le prix Référencement international (langues, pays) 30 Janvier 2019
Inclure une page dans un div avec la source visible pour SEO Développement d'un site Web ou d'une appli mobile 28 Novembre 2018
Site ralenti à cause d'Adsense : note Google Speed divisée par 2 AdSense 16 Novembre 2018
Menu de navigation, diversité des ancres de liens et SEO Référencement Google 24 Octobre 2018