CSS Image

Fermé
Coucoutin Messages postés 68 Date d'inscription jeudi 4 janvier 2007 Statut Membre Dernière intervention 14 novembre 2009 - 16 juin 2008 à 19:56
Coucoutin Messages postés 68 Date d'inscription jeudi 4 janvier 2007 Statut Membre Dernière intervention 14 novembre 2009 - 16 juin 2008 à 23:59
Bonjour à tous,
Je voudrais que quand la souris passe sur mon image, celle-ci s'élargisse.
Vous pensez que c'est possible ? J'ai essayé avec a:hover, ça ne fonctionne qu'a moitié avec cette solution car j'ai l'image que j'ai mis en a:hover apparait mais en dessous de l'image de base.
J'aimerais avoir un effet, d'élargissement de l'image vers la droite,
PROGRESSIF et non pas instantané. Pour l'instant sa donne ça: http://mismouc.free.fr

Merci d'avance pour votre aide.
A voir également:

1 réponse

Coucoutin Messages postés 68 Date d'inscription jeudi 4 janvier 2007 Statut Membre Dernière intervention 14 novembre 2009
16 juin 2008 à 23:11
Oubliez le premier message, mon problème est le suivant maintenant :

"Bonjour à tous,
Voici mon problème http://mismouc.free.fr
Comme vous pouvez le voir sur ce lien, le deuxième élément du menu "Features", ce retrouve à la ligne quand je passe ma souris sur le premier "Home". J'aimerai savoir s'il est possible d'avoir tout les éléments alignés sur la même ligne, même en hover ??
Merci de votre aide."
0
beate Messages postés 166 Date d'inscription dimanche 28 août 2005 Statut Membre Dernière intervention 7 juillet 2010 6
16 juin 2008 à 23:34
Effectivement, il y a un problème:
Les boutons remontent sous FF, et il y a des décalages sous IE.
Peux-tu nous envoyer ton fichier CSS, ou au moins la partie qui concerne les images?
0
Coucoutin Messages postés 68 Date d'inscription jeudi 4 janvier 2007 Statut Membre Dernière intervention 14 novembre 2009 > beate Messages postés 166 Date d'inscription dimanche 28 août 2005 Statut Membre Dernière intervention 7 juillet 2010
16 juin 2008 à 23:59
@charset "utf-8";
body {
background-color: #000000;
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #CCCCCC;
}
img {
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
}
a:hover {
height: 101px;
width: 300px;
background-image: url(images/home_hover.gif);
display: block;
background-repeat: no-repeat;
}

Sachant que depuis j'ai rajouter :

a{
float:left;
}

et du coup ça fonctionne maintenant.
0