Discussion :

[diabolo77]

Salut a tous je suis en train de faire l'intégration de mon site mais j'ai un petit problème comme vous pouvez voir sur la maquette:http://s01.ruedugraphisme.com/img/cm...1298930801.jpg
en dessous de gestion il y a une petit flèche mais voila elle ne veux pas se mettre ou je veux et elle se répète .
si je met no-repeat l'image disparaît :$
et si je la descend comme dans l'image elle disparaît encore donc voici le site actuel .
[http://yourtech.servhome.org/index.html#
voici une partie du du code 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
 
#speedbar
{
    background: url("image/speedbar.jpg") no-repeat scroll 0 0 transparent;
    height: 50px;
    margin-top: -33px;
    text-align: center;
    width: 1024px;
    padding-top: 0px;
    font-size: 20px;
 
}
 
#speedbar li
{
    display: inline-block;
    margin-left: 15px;
    margin-right: 64px;
    padding-top: 3px;
	height:50px;
}
#speedbar a:hover
{
 
    background: url("image/bouton.png") repeat scroll 0px 98px transparent;
    height: 10px;
    width: 52px;
 
 
}

merci d'avance

[ornitho13]

ton problème vient a priori de :

Code css :

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

1
2
3
4
5
6
7
8
9
10
 
#speedbar a:hover
{
 
    background: url("image/bouton.png") repeat scroll 0px 98px transparent;
    height: 10px;
    width: 52px;
 
 
}

tu n'as pas mis de no-repeat et c'est également dans cette instruction qu'il faut mettre à jour la position de ton image.

[diabolo77]

Merci de ta réponse mais comme je t'ai dit si je met un no-repeat la flèche ne s'affiche plus . j'ai mit le site a jour par rapport au no-repeat et voici le code

Code :

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

1
2
3
4
5
 
#speedbar a:hover {
    background: url("image/bouton.png") no-repeat scroll 0 0px transparent;
    height: 10px;
    width: 52px;

merci d'avance

[ornitho13]

En fait ton hover fonctionne bien mais c'est ton <a> qui n'est pas assez grand (en taille).

mets ceci dans ta feuille de style:

Code css :

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

1
2
3
4
5
6
7
8
 
#speedbar a{
	padding-bottom:10px;
}
#speedbar a:hover
{
    background: url("http://yourtech.servhome.org/image/bouton.png") no-repeat;
}

[diabolo77]

Merci beaucoup cela marche comment je pourrait center la flèche selon le mot ?

[Candygirl]

Hello

Code :

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

1
2
3
4
#speedbar a:hover
{
    background: url("http://yourtech.servhome.org/image/bouton.png") no-repeat center bottom;
}