Bonjour à tous,

J'ai encore un petit problème sur mon projet, l'adaptation du CSS pour les navigateurs..

Voilà la partie CSS de ma scrollbar :

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
ul#menu
{
	list-style-type: none;
	margin: 2em 0 0 0;
	width: 910px;
	height: 50px;
	background-color:#ECCAA3;
	border: 2px solid;
	box-shadow: 3px 3px 3px ##ED6700;
	border-color: #ED6700;
	border-radius: 10px;
}
 
ul#menu li
{
	display:inline-block;
	margin-top: 8px;
	padding:0 0.5em;
	color:#AB6600;
}
 
ul#menu li .trait
{
	border-right: 2px solid #BC580B;
}
 
ul#menu a
{
	display: block;
	text-decoration: none;
	color: #F09A45;
	padding: 0 1.5em;
	font-family: Arial;
	font-size: 22px;
	font-variant: small-caps;
	font-weight: bold;
}
 
ul#menu a:hover
{
	text-decoration: underline;
}
 
ul#menu a:visited
{
	color:#A44700;
}
Avec ce code j'obtiens ceci sur Chrome :

Nom : Chrome padding.PNG
Affichages : 98
Taille : 10,1 Ko

Et ceci sur Firefox/IE :

Nom : firefox padding.PNG
Affichages : 76
Taille : 10,0 Ko

Si je retire du CSS "padding:0 0.5em;" de ul#menu li j'obtiens la bonne config sur Firefox et IE :

Nom : Chrome padding.PNG
Affichages : 98
Taille : 10,1 Ko

Mais plus sur Chrome ... :

Nom : chrome without padding.PNG
Affichages : 81
Taille : 2,9 Ko

Avez-vous une idée ?

Je cherchais un moyen d'utiliser des balises tel [if IE] mais ça n'a pas l'air d'exister sur Chrome.

Merci d'avance!