Bonjour,

J'ai tout dit dans le titre ! Comment rendre compatible le menu ci-dessous avec Internet Explorer 8 ?

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
body { font:14px/1.5em "Segoe UI", Arial, Helvetica, sans-serif; background: #000 }
a { text-decoration:none }
#menu { margin-top:30px }
nav{padding-top:210px}
#menu ul{margin:0;padding:0;list-style:none;text-align:center;font-size:0;z-index:30}
#menu li{display:inline-block;position:relative;font-size:12px;font-weight:700;border-right:1px solid #fff;text-transform:uppercase;background:#0e88ed;background:url(menu.png) repeat-x 0 0 transparent}
#menu li a{display:block;letter-spacing:normal;color:#fff;height:35px;padding-left:10px;padding-right:10px;line-height:35px;text-decoration:none}
#menu li li{display:block;background:#2ab2df;text-transform:capitalize;border:none}
#menu li li a{padding:1px;height:20px;line-height:20px}
#menu .sous-menu{background:#2ab2df url(puce.png) no-repeat 95% center}
#menu li ul{position:absolute;-webkit-box-shadow:2px 2px 4px #666;-moz-box-shadow:2px 2px 4px #666;-o-box-shadow:2px 2px 4px #666;box-shadow:2px 2px 4px #666;display:none;}
#menu a:hover,#menu li:hover>a{color:#3b81be;background:#fff}
#menu li:hover>ul{left:0;width:230px}
#menu li li:hover>ul{left:230px;top:0;-webkit-box-shadow:2px 2px 4px #666;-moz-box-shadow:2px 2px 4px #666;-o-box-shadow:2px 2px 4px #666;box-shadow:2px 2px 4px #666}
#menu .dernier{border:none}
#menu>ul>li:hover>ul,#menu>ul>li>ul>li:hover>ul{display:block;}
#menu ul .dernier ul{left:auto;right:0;}
#menu ul .dernier ul ul{left:auto;right:230px;top:0;}
Code html : Sélectionner tout - Visualiser dans une fenêtre à part
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
44
45
46
47
48
<nav id="menu">
    <ul>              
        <li><a href="#">SUPER LIEN 1</a>
            <ul>
                <li><a href="#">Lien 1</a>
                <ul>
                    <li><a href="#">Sous-menu 1</a></li>
                    <li><a href="#">Sous-menu 2</a></li>
                    <li><a href="#">Sous-menu 3</a></li>
                </ul>
                </li>
                <li><a href="#">Lien 2</a>
                <ul>
                    <li><a href="#">Sous-menu 1</a></li>
                    <li><a href="#">Sous-menu 2</a></li>
                    <li><a href="#">Sous-menu 3</a></li>
                    <li><a href="#">Sous-menu 4</a></li>
                    <li><a href="#">Sous-menu 5</a></li>
                </ul>
                </li>
            </ul>
        </li>
        <li><a href="#">SUPER LIEN 2</a></li>
        <li><a href="#">SUPER LIEN 3</a></li>
        <li><a href="#">SUPER LIEN 4</a></li>
        <li><a href="#">SUPER LIEN 5</a></li>
        <li class="dernier"><a href="#">SUPER Lien6</a>
        <ul>
            <li><a href="#">Lien 1</a>
            <ul>
                <li><a href="#">Sous-menu 1</a></li>
                <li><a href="#">Sous-menu 2</a></li>
                <li><a href="#">Sous-menu 3</a></li>
            </ul>
            </li>
            <li><a href="#">Lien 2</a>
            <ul>
                <li><a href="#">Sous-menu 1</a></li>
                <li><a href="#">Sous-menu 2</a></li>
                <li><a href="#">Sous-menu 3</a></li>
                <li><a href="#">Sous-menu 4</a></li>
                <li><a href="#">Sous-menu 5</a></li>
            </ul>
            </li>
        </ul>
        </li>
    </ul>
</nav>

Merci d'avance à ceux qui voudront bien m'éclairer de leur lumière ...