Incompatibilité html/css avec internet explorer 11, solution en javascript

a marqué ce sujet comme résolu.

Bonjour,

Je suis débutante en html/css, lorsque je fais des modifications en css de mon document html, internet explorer mais il n'y a aucun problème avec google chrome, safari ou firefox, refuse d'afficher ces modif, voici le code html :

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
    <!--[if lt IE 9>
            <script src="http://github.com/aFarkas/html5shiv/blob/master/dist/html5shiv.js"></script>
        <![endif]-->
        <link rel="stylesheet" href="zozor.css" />
        <title>Zozor -Le site Web</title>
    </head>

    <body>
    <header>
     <h1>Zozor</h1>
     <h2>Carnets de voyage</h2>
     </header>

     <nav>
        <ul>
            <li><a href="#">Accueil</a></li>
            <li><a href="#">Blog</a></li>
            <li><a href="#">CV</a></li>
        </ul>
     </nav>  

     <section>
     <aside>
 <h1>A propos de l'auteur !</h1>

        <p>C'est moi zozor ! Je suis née un 23 novembre 2005.</p>
        </aside>
        <article>
        <h1> Je suis un grand voyageur </h1>
        <p> bla bla bla bla (texte de l'article)</p>
        </article>
        </section>

    <footer>
    <p>Copyright Zozor - Tous droits réservés<br/>
    <a href="#">Me contacter<a></p>
    </footer>
    </body>
    </html>

Voici le code css :

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
nav
{
    display: inline-block;
    width: 150px; 
    border: 1px solid black;
    vertical-align: top;
}

section
{
    display: inline-block;
    border: 1px solid blue;
    vertical-align: top;
}

En cherchant, je pense connaitre l'origine du problème si j'attribue ce langage css à la balise p ou h1 ou body ou ul, il n'y a aucun problème les modif css s'affichent. Si je retire dans nav, la balise ul ou dans section, les balises aside, h1, p, article, là aussi, les modifs css s'affichent, visiblement hormis body, mon ordinateur refuserait de prendre en compte des modifications css si ma balise contiendrait d'autres balises à l'intérieur, avez-vous une solution, le cas échéant en javascript (je ne connais pas encore le langage) ?

Edit Ymox : correction des fins de blocs de code pour meilleure lisibilité

+0 -0

Salut !

J'ai juste déplacé dans la section "Site web", qui me semble être appropriée, compte tenu de ton problème.

Je relève une petite coquille dans tes "commentaires conditionnels" : le test <!--[if lt IE 9> me semble manquer le crochet fermant avant le >. Je crois bien que sous IE 10 et plus récent, les conditions ne sont plus prises en compte, mais il y a néanmoins des possibilités que les navigateurs les prennent en compte s'ils entrent d'une manière ou d'une autre dans le mode de compatibilité IE 9 ou plus vieux.

+0 -0
Connectez-vous pour pouvoir poster un message.
Connexion

Pas encore membre ?

Créez un compte en une minute pour profiter pleinement de toutes les fonctionnalités de Zeste de Savoir. Ici, tout est gratuit et sans publicité.
Créer un compte