Problème css et lien

[hugo7]

Bonjour je développe un site web en asp.net et dedans j'ai des liens de ce genre

Code :

<a href="Default.aspx" class="menucompte" runat="server">Mon compte</a>

Voici le code css correspondant

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
.menucompte
{
 
   position : relative;
   top : -140%;
   width : 100px;
   display : inline;
   left: 19%;
   height : 33px;
   color : White;
   font-size : 5px;
   font-family : Sans-Serif;
   font-weight : bold;
   text-decoration : none;
   border-left: 1px solid black;
   padding-left: 7px;
 
    }

Mon problème c'est que le lien prend la taille en fonction de la taille de la police et non des valeurs que j'ai mis dans height et width ...
Deuxièmement lorsque je met ceci

Code :

1
2
3
4
.a:hover
{
    background-image : url("..\images\changementmenu.jpg");
    }

Lorsque je survole le lien avec ma souris sa ne marche pas il ne change pas d'image de fond , d'avance merci pour les réponses.

[ornitho13]

Salut,

concernant le survol, cela ne peut pas marcher car tu as mis un point devant le "a" (valable pour les class mais pas pour les tags html).

Concernant le respect des tailles, regarde si cela ne vient pas de ton "padding" (width calculé = width + padding-left + padding-right)

[Candygirl]

Hello,

Envoyé par hugo7

Code :

Les propriétés width et height ne s'appliquent pas à un élément inline.

[hugo7]

Merci pour les réponses , même si j'enlève

Code :

   display : inline;

cela ne marche pas , sinon pour l'histoire du padding j'ai pas tous compris ^^ .
Et pour le survol j'ai enlevé le . devant le "a" et cela ne marche pas non plus .
D'avance merci

[Candygirl]

Envoyé par hugo7

Merci pour les réponses , même si j'enlève

Code :

   display : inline;

cela ne marche pas

Oui, parce que, par défaut, l'élément a est déjà un élément de type inline
Si tu le passe en block (display:block), par exemple, tu verras ton hight et width appliqués. Cela aura d'autres implications qui risquent de nuire à ta mise en page, à voir ce que tu souhaites obtenir pour choisir la meilleure option...

[hugo7]

Merci cela marche mais j'ai un autre problème :
En pleine écran mon menu et comme je le veux mais lorsque je réduit la fenêtre du navigateur c'est le "bordel" , les liens ne sont plus au bon endroits les un sur les autres ...

Code :

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
.menucompte
{
 
   position : relative;
   display : block;
   padding-top : 9px;
   text-align : center;
   top : -175%;
   width : 100px;
   left: 22%;
   height : 23px;
   color : White;
   font-size : 5px;
   font-family : Sans-Serif;
   font-weight : bold;
   text-decoration : none;
   border-left: 1px solid black;
   padding-left : 3px;
    }   
.menudownload   
{
 
   position : relative;
   display : block;
   padding-top : 9px;
   text-align : center;
   top : -272%;
   width : 123px;
   left: 30%;
   height : 23px;
   color : White;
   font-size : 5px;
   font-family : Sans-Serif;
   font-weight : bold;
   text-decoration : none;
   border-left: 1px solid black;
 
 
}  
.menuressources
{
 
   position : relative;
   display : block;
   padding-top : 9px;
   text-align : center;
   top : -369%;
   width : 100px;
   left: 39.7%;
   height : 23px;
   color : White;
   font-size : 5px;
   font-family : Sans-Serif;
   font-weight : bold;
   text-decoration : none;
   border-left: 1px solid black;
   padding-left : 1px;
   border-right: 1px solid black;
}  
 
.menudeconnexion
{
 
   position : relative;
   display : block;
   padding-top : 9px;
   text-align : center;
   top : -466%;
   width : 100px;
   left: 73%;
   height : 23px;
   color : White;
   font-size : 5px;
   font-family : Sans-Serif;
   font-weight : bold;
   text-decoration : none;
   border-left: 1px solid black;
   padding-left : 1px;
   border-right: 1px solid black;
}  
 
.menuaide
{
 
   position : relative;
   display : block;
   padding-top : 9px;
   text-align : center;
   top : -566%;
   width : 80px;
   left: 81%;
   height : 23px;
   color : White;
   font-size : 5px;
   font-family : Sans-Serif;
   font-weight : bold;
   text-decoration : none;
   padding-left : 1px;
   border-right: 1px solid black;
}

Je voudrais savoir aussi comment faire pour paramétrer le lien lorsque l'utilisateur clic dessus , c'est à dire par exemple si l'utilisateur clic sur le lien "Mon Compte" celui-ci devienne Bleu.

D'avance merci

[ornitho13]

Peut être aurais tu une démo (et/ou image) à montrer car on ne peut pas voir le problème en plein écran.

[hugo7]

En faite je crois que j'ai trouver , lorsque je place mes éléments je les places en % ,or les % dépendent de la taille de la fenêtre il me semble.