hover non fonctionnel

**smillingbandit** · 25/08/2009, 16h01

Bonjour, je travail sur objet qui est un bloc de recherche sous ez publish.

Code :

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

1
2
   <div align=right><input type="submit" title="lancez la recherche" name="ok" value="OK" style="background-color:#d20047;a:hover{
background : #646464;text-decoration: none;} ;color: #ffffff;border: 0px" ></div>

Le hover ne fonctionne pas, il s'agit d'un problème html. Ma manière de l'écrire ne doit pas être bonne.

**andry.aime** · 25/08/2009, 16h18

Bonjour,
C'est dans une balise input que tu mets le a:hover, c'est normale que ça ne marche pas.

**smillingbandit** · 25/08/2009, 16h40

Dans ce cas le

Code :

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

1
2
a:hover{
background : #646464;

Je le mets ou exactement par rapport au reste du code ?

**cssman** · 25/08/2009, 17h52

a est une balise, au même titre que input. Tu ne peux pas mettre une balise dans un attribut !

:hover est une pseudo-classe, à appliquer à un sélecteur. Genre :

Code css :

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

1
2
3
4
5
6
7
 
a:hover {
....
}
input:hover {
...
}

ou mieux en ce qui te concerne :

Code css :

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

1
2
3
4
 
input[type=submit]:hover {
background : #646464;
}

Et ça tu ne le mets pas en inline, tu le sors de ton code html pour le mettre dans une déclaration de styles entre les balises head

Code html :

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

1
2
3
4
5
6
 
<head>
<style type="text/CSS">
...
</style>
</head>

ou mieux dans une feuille de style externe.

En passant : l'attribut align=right est déprécié. Ça aussi ça se déclare par un style.

**Macmillenium** · 25/08/2009, 18h01

Envoyé par cssman

a est une balise

- A est un élément;
- <a> est une balise;
- </a> est une balise;

Parler de A, c'est parler de l'élément A.

Envoyé par cssman

Tu ne peux pas mettre une balise dans un attribut !

Ou tout simplement, l'attribut STYLE ne peut contenir que des déclarations, pas de règles

**Doki95** · 25/08/2009, 18h03

Salut,

Je crois que le hover sur un input ne fonctionne pas sous ie6. Tu es obligé de mettre une balise a contenant un href. Tu peux faire comme ça :

Code html :

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

1
2
3
4
 
<a href="javascript:void(0)">
  <input type="submit" title="lancez la recherche" name="ok" value="OK" />
</a>

Et tu rajoutes le css correspondant comme te la indiqué cssman.
Enfin pas tout à fait. Le hover se retrouve bien sur le a avec cette solution.

Doki

**smillingbandit** · 26/08/2009, 12h08

Donc si j'ai bien compris, je dois ajouter dans le css:

Code :

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

1
2
3
input[type=submit]:hover {
background : #646464;
}

Et dans le html:

Code :

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

1
2
3
<a href="javascript:void(0)">
  <input type="submit" title="lancez la recherche" name="ok" value="OK" />
</a>

Ca me parait un peu étrange.

hover non fonctionnel

Survol d'un élément en CSS (:hover)

Vue hybride

Discussions similaires

Partager

Partager