Bonjour Miss Louna, 

Je te mets ici le CSS que j'ai ajouté afin que mon module derniers visiteurs soit comme il est ! sur ce blog .

Ton module derniers visiteurs porte le numéro  138683012. Il te faudra adapter les différentes valeurs en fonction de ce que tu veux exactement -- les 10 visiteurs sur une seule colonne: auquel cas, la largeur et la longueur du module est à calculer en fonction des dimensions de tes avatars ( je pense qu'ils sont un peu plus gros que les miens donc mes valeurs 308 haut et 54 large sont à augmenter) ou deux colonnes visiteurs: auquel cas, tu doubles la largeur du module et diminue de moitié la hauteur ou ...-- Il te faudra aussi jouer avec les marges intérieures pour bien placer les avatars.

Une fois que tu as trouvé les dimensions de ton module, tu adaptes le positionnement top et left. Pour le top ( le négatif), il dit de combien remonte le module ou de combien il est caché car en dehors de la page.

Le top  du module en hover ( les 2 dernières lignes de code) est pour position  au survol de la souris.

/*MOD Derniers VISITEURS*/
#module_menuXXXXXXXXX .module_menu_contenu_block {
position: fixed;

top:-214px; /*distance du bord haut/positionnement vertical*/
     left: 1%;  /*positionnement horizontal*/
     height: 308px;/* hauteur du module*/
     width:54px; /*largeur du module*/ 
       padding-bottom:0px; /*marge interieure haut*/
    padding-left: 19px;/*marge gauche*/
    padding-right:0px; /*marge droite*/
border-bottom-left-radius: 3em; /*bords arrondis*/
border-bottom-right-radius: 3em;
 box-shadow:  -1px 2px 5px 1px rgba(0, 0, 0, 0.7), /*fond ombre*/
 -1px 2px 20px rgba(255, 255, 255, 0.6) inset;
background-color: rgba(213, 202, 191, 0.2);
transition-property: all;/* pour declarer les trasitions*/
 -webkit-transition: all 0.5s linear;     
-moz-transition: all 0.5s linear;     
 -o-transition: all 0.5s linear;    
 -ms-transition: all 0.5s linear;     
 transition: all 0.5s linear;}

#module_menuXXXXXXXXX .module_menu_contenu_block:hover{
    top: 26px;/* position module déployé*/}

Bonjour Miss Louna  et Bonne année à toi et tes proches ..

Pour le style des infobulles, je l'ai mis dans le CSS , attribué au sélecteur des infos bulles #help_bubble
donc il s'applique pour tous les liens qui dans le html ont un titre  qui fait apparaitre l'infobulle .

je te le copie en dessous

/*********************************** infobulle****************/
#help_bubble {    
    color: white; /*couleur texte*/        
    border-radius: 30px 30px 30px 0px;/*bords arrondis*/
    border:2px solid white;/*bordure blanche*/
    margin-left: 36px;/*distance gauche du lien*/
    margin-bottom: 8px;/*distance bas du lien
    padding:5px; /*marge interieur*/
    background: rgba(61, 70, 40, 0.7);/*couleur fond*/  
-webkit-box-shadow: 6px 6px 10px black;/*ombre*/     
box-shadow: 6px 6px 10px black; 

    transition: all 0.30s;/*delai pour les changements*/ 
    transform: scale(1.2)/*grossit le texte*/ 
        rotate(-12deg); /*penche la bulle*/
    opacity: 1; z-index: 500;
}

Concernant les images des avatars dans le module derniers visiteurs, si tu veux qu'ils changent, se transforment au passage de la souris:

1- dans le sélecteur.module_menu_type_lastvisitors img  --c'est à dire les images présentes dans le module derniers visiteurs--, tu déclares comment sont les avatars au départ ainsi que la vitesse  (et la façon:linear est pour une transformation régulière) à laquelle ça va changer.

2- dans le sélecteur.module_menu_type_lastvisitors img:hover --c'est à dire les images du module derniers visiters avec hover donc au passage souris-- , tu déclares comment ça va se transformer: est ce que ça va tourner( fonction rotate) ou s'agrandir( fonction scale)  ou  ces deux fonctions à la fois

/* EFFETS img derniers visiteurs*/
.module_menu_type_lastvisitors img { 
    max-height:60px; max-width:60px; 
border-radius: 7px;

    transition:0.4s linear; 
    -moz-transition: 0.4s linear; /* Firefox */ 
    -webkit-transition: 0.4s linear; /* Safari and Chrome */ 
    -o-transition: 0.4s linear; /* Opera */ 
} 

.module_menu_type_lastvisitors img:hover { 
    -webkit-transform: scale(2);
    transform:rotate(270deg)scale(2); 
    -ms-transform:rotate(270deg)scale(2); /* IE 9 */ 
    -moz-transform:rotate(270deg)scale(2); /* Firefox */ 
    -webkit-transform:rotate(360deg)scale(2); /* Safari and Chrome */ 
    -o-transform:rotate(270deg)scale(2); /* Opera */ 
     }