Discussion :

[choinul]

Bonjour, j'ai des différences d'interprétation du css de mon site cv entre windows et linux.

Linux :



Windows :



Sous windows, j'ai sous le menu une bordure qui apparait (sous cursus). Il me semble que ça doit être la bordure différenciant le fond de ul et le fond de li...

Dans les deux cas, j'utilise firefox. J'ai testé avec différentes versions de firefox.

Le site concerné est ici : http://www.hds.utc.fr/~joneshaz/index.html

Voici mon css (les parties intéressantes) :

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
 
ul.menu {
	margin: 0px;
	background-color: #9999ff;
 
	background-position: top;
 
	border-top: thin solid #4169E1;
 
	border-bottom : none;  
    padding-bottom : 0px;
    bottom : 0px;
}
ul.menu li {
  display: inline;
  font-size: 14px;
  font-weight: bold;
  border-bottom : none;  
  padding-bottom : 0px;
  bottom : 0px;
}
 
ul.menu li.labo {
  	background-image: url("heudiasyc.gif");
	background-repeat: no-repeat;
	background-position: top;
	width:91px;
}
 
ul.menu a {
  /*border-right: 2px solid #ddeeaa;
  border-left: 2px solid #ddeeaa;*/
  color: white;
  text-decoration: none;
  padding-left: 20px;
  padding-right: 20px;
  margin:0px;
  background-position : bottom;
  border-bottom : none;
 bottom : 0px;
}
 
ul.menu a.special {
	/*border-right: 2px solid #ddeeaa;
	border-left: 2px solid #ddeeaa;*/
	color: #9999ff;
	text-decoration: none;
	padding-left: 20px;
	padding-right: 20px;
	padding-bottom: 0px;
	margin:0px;
	background-position:  -1px;
	background-color: White;
	border-bottom : none;
	bottom : 0px;	
}
 
ul.menu li a:hover {
  background-color: #3333ff;
}
 
ul.menu li a.special:hover {
	background-color: #AFEEEE;
}
 
ul.menu a.drapeau {
	/*border-right: 2px solid #ddeeaa;
	border-left: 2px solid #ddeeaa;*/
	/* color: #9999ff; */
	text-decoration: none;
	padding-left: 20px;
	padding-right: 20px;
	background-image: url("english.jpg");
	background-repeat: no-repeat;
	background-position: top;
}

Est-ce que vous voyez d'où ça peut venir?

[austriker]

Bonjour,
Alors, on peut voir que tu as essayé de pas mal bricoler :p

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
 
ul.menu {
	margin: 0;
	background-color: #9999ff;
	border-top: thin solid #4169E1;
	padding-top:4px;
}
ul.menu li {
	display: inline;
	font-size: 14px;
	font-weight: bold;
	padding:0;
}
ul.menu li.labo {
	background: url("heudiasyc.gif") no-repeat 0 0;
	width:91px;
}
ul.menu a {
	color:#FFF;
	text-decoration: none;
	padding:1px 20px;
	margin:0;
}
ul.menu a.special {
	color: #9999ff;
	text-decoration: none;
	padding:2px 20px;
	margin:0;
	background-color:#FFF;
	border:none;
}
ul.menu li a:hover {
	background-color: #3333ff;
}
ul.menu li a.special:hover {
	background-color: #AFEEEE;
}
ul.menu a.drapeau {
	text-decoration: none;
	padding:20px;
	background: url("english.jpg") no-repeat 0 0;
}

Essayes avec ca, je pense que ca devrait passer.
La ligne doit etre du a la petite taille de la ligne donc si tu rajoute du padding sur les <a> (ul.menu a.specia) ca devrait passer...

Voila, dis moi si ça marche.
Austriker

EDIT : J'ai corrigé un truc, ca devrait être mieux comme ca.
EDIT 2 : J'ai ajouté un padding pour garder l'espace entre l'onglet et le haut du menu.

[choinul]

Merci pour ta réponse. En effet, j'ai pas mal bidouillé pour enlever cette ligne!

Malheureusement, ça marche toujours pas, il y a effectivement un décallage sous linux quand je mets ton code, mais sous windows, j'ai toujours la ligne sous le menu sélectionné.

Déjà, j'ai du mal à comprendre qu'il y ait des différences entre linux et windows alors que j'utilise le même navigateur.

EDIT : J'essaye avec les éléments que tu as corrigé.

EDIT 2 : ça marche! Il faut que je replace le drapeau car il a été décalé.