Forum d'entraide PHPFrance

Bonjour,
je n'arrive pas a aligner horizontalement deux images sur lesquelles il y a un rollover ???

Si qqu'un a une idée ou une voie de reflexion ... Je suis tres preneur !

Voici mon code :

Code : Tout sélectionner


a.image { /* définition de la classe "image" de la balise <a> */
     display: block; /* la balise a doit être en bloc */
	 width: 60px; /* largeur de l'image réactive */
     height: 30px; /* hauteur de l'image réactive */
     background-image: url(images/part3.jpg) ; /* source de l'image de départ */
     background-repeat: no-repeat;
     }
	 
a.image:hover { /* définition de la classe "image" de la balise <a> au survol */
     background-image: url(images/part3f.jpg); /* source de l'image d'arrivée */
     } 

a.image2 { /* définition de la classe "image" de la balise <a> */
     display: block; /* la balise a doit être en bloc */
     width: 60px; /* largeur de l'image réactive */
     height: 30px; /* hauteur de l'image réactive */
     background-image: url(images/part4.jpg); /* source de l'image de départ */
     background-repeat: no-repeat;
     }
	 
a.image2:hover { /* définition de la classe "image" de la balise <a> au survol */
     background-image: url(images/part4f.jpg); /* source de l'image d'arrivée */
     }

j'ai oublié de preciser que les images se mettent les unes en dessous des autres ...

Pour positionner tes images l'une a cote de l'autre, utilise la balise float (float:left par exemple)

Sinon il me semble que display:block aligne les blocs verticalment et display:inline les aligne horizontalement

Pour le CSS regarde du cote des sites Alsacreation , Openweb et Pompage qui ont de tres bon tutos sur le positionnement

tu vas me trouver bidon mais ou dois je mettre le mettre ?

Sinon il me semble que display:block aligne les blocs verticalment et display:inline les aligne horizontalement

Place le float dans a.image et dans a.image2.

Mais en regardant ton code de plus pres, je ne suis plus tres sur de comprendre ce que tu desires obtenir...

merci bcp j'ai utilisé le float:left et right et ca marche !!!

Encore merci pour tout

voici l'adresse si tu veux voir ce que je voulais faire :
http://www.images-de-prestige.info
c'est les boutons entrer et enter qui se mettaient l'un en dessous de l'autre ...

Pense a mettre le tag RESOLU a ton msg stp

Forum d'entraide PHPFrance

pb avec display:block en css

pb avec display:block en css