Changer la taille des avatars de chatbox

Salut salut! j'ai moi aussi vu cette nouvelle fonction ajoutée par forumactif et j'aurais aimé la modifier un petit peu. Ce que j'aimerais faire est tout simple : c'est de changer la taille des avatars pour l'optimiser à celle de notre forum. En effet, nos avatars ne sont pas carrés et du coup c'est tout replié quand ça s'affiche. J'ai essayé de modifier les codes correspondants mais ça ne marche pas, et je ne vois pas vraiment pourquoi hors que ça marche très bien quand je le fait à l'aide de "inspecter l'élément".

Voila le code que j'ai voulu utiliser:

Code:

#chatbox .cb-avatar {
  height: 62px;
  width: 69px;
  overflow: hidden
}

#chatbox .cb-avatar > img {
  height: 160px;
  width: 68px;
}

...et qui ne marche pas. L'adresse de mon forum est ici : http://souls-crossing.forumsactifs.com/ merci d'avance!

Up

Coucou Pito :)

Le problème vient du fait que le CSS rajouté par forumactif pour les avatars est mis après ton propre CSS personnalisé (une "erreur" de forumactif je pense). Du coup, leur code CSS "écrase" ce que toi tu définis.

Petit tuto de Manumanu, à lire si tu veux en savoir plus : Principe du CSS : Le poids des déclarations

Screen d'exemple :

On peut voir que ton CSS est barré, car le CSS de forumactif pour les avatars l'override :)
Il est ajouté après le CSS personnalisé... Je pense que les dev' de forumactif vont finir par modifier ce petit problème (à moins que cela soit un choix)

Il y a 2 manière de faire pour avoir quand même ce que tu veux : rajouter "!important" ou bien augmenter le poids du sélecteur.

En rajoutant !important, tu obtiens ceci :

Code:

#chatbox .cb-avatar {
  height: 62px!important;
  width: 69px!important;
  overflow: hidden!important;
}

#chatbox .cb-avatar > img {
  height: 160px!important;
  width: 68px!important;
}

Sinon, l'autre version en augmentant le poids du sélecteur :

Code:

#chatbox .cb-avatar.cb-avatar {
  height: 62px;
  width: 69px;
  overflow: hidden
}

#chatbox .cb-avatar.cb-avatar > img {
  height: 160px;
  width: 68px;
}

Normalement les 2 versions fonctionnent :)

Bonjour! merci ça marche parfaitement avec l'important! mon problème est réglé, merci encore!