Menu rendu en ligne différent du Dev

**Pelote2012** · 11/04/2013, 14h57

Bonjour,

Voilà j'ai fait une petite appli avec un menu horizontal.
Quand je publie mon projet en local, dans IIS je créé un nouveau siteWeb, le rendu est nickel.

Quand je le met sur le serveur ... bah mon menu se met vertical et centré sur la page au lieu d'être à gauche.

Code css :

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
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
ul
{
    padding-left: 0px;
}
li
{
    padding-left: 0px;
}
/*MENU*/
/* On choisi la largeur de notre menu, et on répartit les éléments */
.menu_deroulant
{
    padding: 0;
    list-style-type: none;
    text-align: center;
    display: table;
    background-color: #FFCC66;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25), 0 -1px 0 rgba(0, 0, 0, 0.1) inset;
    border-radius: 4px 4px 0 0;
    padding: 10px 0;
    z-index: 1;
    padding-right: 2px;
}
 
/* On place le texte de nos menu centré */
.menu_deroulant li
{
    display: table-cell;
    text-align: center;
    list-style-type: none;
    width: 125px;
}
 
.menu_deroulant li ul
{
    list-style-type: none;
    display: none;
    position: absolute;
    background-color: #EC8D00;
    margin: 10px 0;
    border-color: rgba(0, 0, 0, 0.2);
    border-radius: 0 0 6px 6px;
    border-style: solid;
    border-width: 0 1px 1px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
    z-index: 2;
}
 
 
/* On remet le sous menu en vertical */
.menu_deroulant li ul li
{
    display: block;
    border: none;
}
 
.menu_deroulant li ul li:hover
{
   background-color: #FFCC66;
}
 
.menu_deroulant a
{
    line-height: 19px;
    padding: 10px 10px 11px;
}

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
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="ctl00_Head1">
    <script src="/script/Helper.js" type="text/javascript"></script>
    <script src="/script/jquery-1.9.0.js" type="text/javascript"></script>
    <script src="/script/jquery-ui-1.10.0.custom.min.js" type="text/javascript"></script>
    <script src="/script/ModalPopupResult.js" type="text/javascript"></script>
    <script src="/script/Menu.js" type="text/javascript"></script>
    <link href="/CSS/ui-lightness/jquery-ui-1.10.0.custom.min.css" rel="stylesheet" type="text/css" /><title>
	Accueil
</title><meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<link id="ctl00_lnkCss" href="CSS/ConfMob.css" rel="stylesheet" type="text/css" /></head>
<body>
    <form name="aspnetForm" method="post" action="Default.aspx" id="aspnetForm">
<div>
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKMTMwNjIzNjgzNWQYAQUeX19Db250cm9sc1JlcXVpcmVQb3N0QmFja0tleV9fFgIFF2N0bDAwJExvZ2luU3RhdHVzJGN0bDAxBRdjdGwwMCRMb2dpblN0YXR1cyRjdGwwM4yXSZSoJG+tiopcgJUJcCT4lTe7mNEIRKph2WcsQ/O1" />
</div>
 
<script type="text/javascript">
//<![CDATA[
var theForm = document.forms['aspnetForm'];
if (!theForm) {
    theForm = document.aspnetForm;
}
function __doPostBack(eventTarget, eventArgument) {
    if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
        theForm.__EVENTTARGET.value = eventTarget;
        theForm.__EVENTARGUMENT.value = eventArgument;
        theForm.submit();
    }
}
//]]>
</script>
 
 
<script src="/WebResource.axd?d=oqmGpKao99be5R-KY8NgHY-6CplX_KwY6LIeYV7WUpxaI3-J_CJxKWoaNdUVN4hFCdfQyrcAUwB2TNqtT3JKC_lAsCjBdTHbCW8z-uDJ4os1&amp;t=634944691978768021" type="text/javascript"></script>
 
 
<script src="/ScriptResource.axd?d=ZSB-zMd9Xj080Vh9wuVrk_4SkbeEPWF7L2x4BJb3dGZ0Kl3eG_U924roQHQiZpiJF8UCK8KVNIrJNmYFFpSaylXftZiQvDGyYuIFNC9-b9wcvYNtCDfLN-sYIhvk5AJFsVaBWZf1er1zQmD2AGTxGNrClcJ_9I5YyksG-H1WA_jbjXNGXy3KeR0jFl4rn3xL0&amp;t=ffffffff940d030f" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
if (typeof(Sys) === 'undefined') throw new Error('Échec du chargement de l\u0027infrastructure ASP.NET Ajax côté client.');
//]]>
</script>
 
<script src="/ScriptResource.axd?d=yD2teEEN5Az346wM0NWRZMzZ2ZRa-asZvOqDNv-H67rD8emfcuCGGWAx-1ThZv7q2bH-BFuRL9UwVx0g4XvfCFFGInPGHEiIP--dTNE-YZC-xZTd-ctOgcJMG_A-fZ3IJKaWdn2t7M1OQvcsbs4VKauT4Skdb72CgGaTKxKsInBm-qh-YAnmk6epdppiyPCI0&amp;t=ffffffff940d030f" type="text/javascript"></script>
<div>
 
	<input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="/wEWAgKQ67OvCAL497TjBgGgKBluWYmdG7vZ5tvTrGnhPD6oO+yhMIbWplKYw6nR" />
</div>
    <script type="text/javascript">
//<![CDATA[
Sys.WebForms.PageRequestManager._initialize('ctl00$SM', 'aspnetForm', ['tctl00$UP',''], [], [], 90, 'ctl00');
//]]>
</script>
 
    <div id="ctl00_UP">
 
            <div id="Page">
                <div id="Connexion">
                    Mon Compte :
                    <span id="ctl00_LoginName">Admin@configMobilier.fr</span>
                    |&nbsp;<a id="ctl00_LoginStatus" href="javascript:__doPostBack('ctl00$LoginStatus$ctl00','')">Déconnexion</a>
                </div>
                <div id="Header">
                    <div id="NomSite">
                        <img id="ctl00_ImgFT" src="Images/Quadria-Gris.jpg" style="border-width:0px;" />
                    </div>
                </div>
                <div id="Content">
 
                    <ul id="ctl00_NavigationMenu" class="menu_deroulant">
                        <li><a href="/Default.aspx" title="">Accueil</a></li>
                        <li><a href="/Societes/lst_Societe.aspx" title="">Sociétés</a></li>
                        <li><a href="#" title="">Base articles</a>
                            <ul>
                                <li><a href="/Articles/Edit_Grossistes.aspx">Grossistes</a></li>
                                <li><a href="/Articles/Edit_Composant.aspx">Composants</a></li>
                                <li><a href="/Articles/Edit_couleur.aspx">Coloris</a></li>
                                <li><a href="/Articles/Lst_Element.aspx">Elements</a></li>
                                <li><a href="/Articles/Lst_Article.aspx">Articles</a></li>
                                <li><a href="/Articles/Lst_Custom.aspx">Customs</a></li>
                                <li><a href="/Articles/Lst_Configuration.aspx">Configurations</a></li>
                            </ul>
                        </li>
                    </ul>
                    <div id="Contenu">
                        <div id="c">
 
    <h1>
        <span id="ctl00_Contenu_lblTitre">Accueil</span>
    </h1>
 
 
                        </div>
                    </div>
                </div>
                <div id="Bottom">
                    <span id="ctl00_locCopright" class="lnk">Copyright 2013 Quadria -</span>
                    - <a href="MailTO:MCO_Devs@quadria.fr" class="lnk">Nous contacter</a>
                </div>
            </div>
 
</div>
    <div id="MsgBack" title="Download complete">
        <div class='subcontent-box' id='Errortitre'>
        </div>
    </div>
    </form>
</body>
</html>

quelqu'un peut me dire comment je peux faire

**rodolphebrd** · 11/04/2013, 15h03

Tel quel en local je ne vois de problème.

Le menu est bien horizontal et aligné à gauche.

Vider le cache navigateur et réessayer.

**Pelote2012** · 11/04/2013, 15h16

Pourquoi vider le cache. mes tests sont fait à partir de mon poste

ça marche avec Chrome.

Mais en faisant F12, j'ai remarqué que mon site est poussé sur la norme IE7

**rodolphebrd** · 11/04/2013, 15h25

Dans ce cas IE7 n'aime pas table-cell d'où l'alignement vertical du menu.

**Pelote2012** · 11/04/2013, 15h29

http://blog.codefluententities.com/2...-your-website/

1.Click Start, click Run, type inetmgr.exe, and then click OK.
2.Expand the server you want and then expand Web Sites.
3.Right-click the Web site you want and then click Properties.
4.Click the HTTP Headers tab.
5.Under Custom HTTP headers, click Add.
6.In the Custom header name box, type X-UA-Compatible.
7.In the Custom header value box, typeIE=EmulateIE9.
8.Click OK two times

ça l'air de marcher sous tous mes navigateurs
IE=Edge marche aussi

Pour les explication
http://stackoverflow.com/questions/6...ontent-ie-edge
mais ça fais quoi si je me connecte avec IE8

Menu rendu en ligne différent du Dev

Tableau en CSS

Vue hybride

Discussions similaires

Partager

Partager