[CSS] Affichage dans different navigateur

**Shakta** · 21/04/2005, 16h46

Bonjour a tous,

Je desirais savoir comment forcer(c un grand mot) l'affchage de css pour que tous les navigateur surtout IE afffiche les css en entier.

Je m'explique j'ai fais un menu ou il y des borders. Opera est le seul navigateur qui m'affiche toutes mes bordure alors que IE et FireFox n'affiche que partiellement mais bordure.

Vous devez vous douter que c embrassant vu que Opera est le navigatuer le moins utiliser.

Si qqun aurais un debut de repose ou une ressource permettant de forcer les navigateurs a afficher l'exactitude de ma feuille css.

Merci d'avance .

Shakta

**beeboo** · 21/04/2005, 17h23

Si tu pouvais nous donner ton code ça nous aiderait. Car, en général, si ça marche pas, c'est que le code a une couille quelque part.

**Shakta** · 21/04/2005, 17h57

Bon vu que mon menu est enorma voici un bout

partie html :

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
19
20
21
22
23
24
<div class="Menu"><!--Menu-->
	<a id="m" href="#" onMouseover="DisplayMenu(1,0)">MENU1</a>
</div>
 
<div id="1"><!-- MENU_1 -->
	<a href="#" onMouseover="DisplayMenu(1,11)" >SousMenu1</a><br>
	<a href="#" onMouseover="DisplayMenu(1,12)" >SousMenu2</a><br>
	<a href="#" onMouseover="DisplayMenu(1,13)" >SousMenu3</a><br>
</div>
	<div id="11"><!-- SousMenu1 -->
		<a href="#" onclick="" >Lien1</a><br>
		<a href="#" onclick="" >Lien2</a><br>
		<a href="#" onclick="" >Lien3</a>
	</div>
 
	<div id="12"><!-- SousMenu2 -->
		<a href="#" onclick="" >Lien1</a><br>
		<a href="#" onclick="" >Lien2</a><br>
	</div>
	<div id="13"><!-- SousMenu3 -->
		<a href="#" onclick="" >Lien1</a><br>
		<a href="#" onclick="" >Lien2</a><br>
		<a href="#" onclick="" >Lien3</a>
	</div>

Partie Css

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
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
body{
	font-family : Arial;
	font-size : 12px;
	color : #000000;
}
A:link
{
    text-decoration: none;
	font-family: Arial;
	font-size: 12px;
	color: #003399;
}
 
A:visited
{
    text-decoration: none;
	font-family: Arial;
	font-size: 12px;
	color: #003399;
}
 
A:active
{
    text-decoration: none;
	font-family: Arial;
	font-size: 12px;
	color: #003399;
}
 
 
.Menu
{
	font-family: Arial;
	font-size: 12px;
	position: absolute;
	left : 0px;
	top : 65px;/*	width : 700;
	height : 20;
	clear : both;
	z-index: 2;
	overflow: visible;*/
 
}
 
.ongletActif {
	margin: 0px 2px 2px 2px; /* marges intérieures */
	padding: 2px 5px 5px 5px; /* marges extérieures */
	background-color: #E9EDF7; /* le fond de l'onglet actif est blanc*/
	border-bottom: 3px solid #5E86C3;
	vertical-align: middle;
 
}
.ongletPassif {
	margin: 0px 2px 2px 0px; /* marges intérieures */
	padding: 2px 5px 5px 5px; /* marges extérieures */
	background-color: #F5F6FA; /* le fond de l'onglet actif est blanc*/
}
.AffNot
{
	visibility: hidden;
}
 
.C1 
{	position: absolute;
	left: 0px;
	top: 90px; /*float :none;*/
	visibility: visible;
 
	background-color: #E9EDF7;
	padding: 1px 5px 2px 5px;	
	border-bottom: solid 1 #5E86C3;
	border-left: solid 1 #5E86C3;
	border-right: solid 3 #5E86C3;
	border-top: solid 1 #5E86C3;
}
 
.C2 
{
	left: 60px;
	top: 90px; /*float :none;*/
	position: absolute;
	background-color: #E9EDF7;
	padding: 1px 5px 2px 5px;	
	border-bottom: solid 1 #5E86C3;
	border-left: solid 1 #5E86C3;
	border-right: solid 3 #5E86C3;
	border-top: solid 1 #5E86C3;
	visibility: visible;
}
 
.C11, .C12, .C13 
{
	left: 80px;
	top: 90px; /*float :none;*/
	visibility: visible;	
	position: absolute;
	background-color: #E9EDF7;
	padding: 1px 5px 2px 5px;	
	border-bottom: solid 1 #5E86C3;
	border-left: solid 1 #5E86C3;
	border-right: solid 3 #5E86C3;
	border-top: solid 1 #5E86C3;
	visibility: visible;
}

Je crois que cela vient des mon css mais j'avoue ne pas etre un pro .
j'ai tester sur trois navigateur seul Opera donne le bon resultat.

J'esperes que c assez clair , si vous avez beoin du javascript dite le.

Merci d'avance car moi je block

**beeboo** · 21/04/2005, 22h27

A première vue je ne vois pas de caca dans l'html ni dans le css, peut-être cela vient-il du code javascript et de l'utilisation des objets DOM. Les navigateurs ne réagissent pas toujours de la même façon. Montre un peu le code de DisplayMenu et des évetuelles fonctions associées, peut-être qu'on trouvera qqchose dedans.

**Shakta** · 22/04/2005, 08h49

Tiens ,
si tu trouves bravo, et je suis preneur . Moi j'ai cherché pendant trops longtemps, je suis sur une autre piste.

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
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
function DisplayMenu(Id, Id_ED)
{
	var tabMenu = new Array("m");
	var tabED = new Array("11","12","13");
	var actif = 0;
 
	if(DisplayMenu.arguments[0] == 0)
	{
 
	for(i=0; i<tabMenu.length; i++)
   	{
   	   actif = i+1;
 
   	 document.getElementById(tabMenu[i]).className = "OngletPassif";
   	 document.getElementById(actif).className = "AffNot";
 
   	}
 
   	for(j=0; j<tabED.length; j++)
   	{
   		document.getElementById(tabED[j]).className = "AffNot";
   	}
	}
	else
	{
	 	for(i=0; i<tabMenu.length; i++)
   	{
   		actif = i+1;
   		if(actif == Id)
   		{	
   			document.getElementById(tabMenu[i]).className = "OngletActif";
   			document.getElementById(actif).className = "C"+actif;
   		}
   		else
   		{	
   			document.getElementById(tabMenu[i]).className = "OngletPassif";
   			document.getElementById(actif).className = "AffNot";
   		}
   	}
 
    if(parseInt(DisplayMenu.arguments[1]) == 0)
    {
 
    	for(k=0; k<tabED.length; k++)
   		{
   			document.getElementById(tabED[k]).className = "AffNot";
   		}
    }         
    else(DisplayMenu.arguments[1] != 0)
    { 
    	var CLASS = "init";
     	for(j=0; j<tabED.length; j++)
   		{
   			if(parseInt(tabED[j]) == parseInt(DisplayMenu.arguments[1]))
   			{	
   				CLASS =  "C"+tabED[j];
   				document.getElementById(tabED[j]).className = CLASS;  }
   			else
   			{	document.getElementById(tabED[j]).className = "AffNot";  }
   		}
    }
  }  
 
}

**Pluch666** · 22/04/2005, 10h57

le problème vient du css ie et ffx n'interprètent pas les border si tu ne spécifies pas de dimensions, bref

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
   border-bottom: solid 1px #5E86C3;
   border-left: solid 1px #5E86C3;
   border-right: solid 3px #5E86C3;
   border-top: solid 1px #5E86C3;

**Shakta** · 22/04/2005, 11h12

Merci Pluch666

Comme quoi se sont toujours les petit detail qui sont jamais visible

[CSS] Affichage dans different navigateur

CSS

Discussions similaires

Partager

Partager