Taille de l'avatar

[crocnana]

Bonsoir. En cherchant sur Forumactif, j'ai trouvé ce code pour modifier la forme de l'avatar dans les sujets. Je les voudrai rectangulaires et ils restent désespérément carrés. Pouvez-me dire ce que je dois modifier ? Merci.

Voici le code :

Code:

.avatar-big img {
  border-radius: 0px!important;
  height:auto;
  width:auto;
  max-width:320px;
  max-height:400px;
}

En image :



J 'ai testé avec différentes images comprenant la taille indiquée dans le code, sans succès.

[Oka.mi]

Re,

C'est parce que vous définissez les propriétés height et width sur "auto" donc elles font un peu ce qu'elles veulent. https://developer.mozilla.org/fr/docs/Web/CSS/width
Essayez plutôt comme ça :

Code:

.avatar-big img {
  border-radius: 0px!important;
  height:400px;
  width:320px;
}

[crocnana]

Merci Okami, j'avais bien testé sans le auto aussi et je viens de réessayer au cas où. L'avatar reste carré.
Le auto, si j'ai bien compris sur le sujet que j'avais trouvé, avait son utilité pour les membres qui mettraient des images trop ou plus petites.

Est- ce que par hasard, si cela ne fonctionne pas chez moi, cela pourrait provenir d'un autre code dans la css ?  J'ai utilisé un sujet pour mettre l'avatar en cercle vert (connecté) ou rouge pour déconnecté.  Un conflit de codes ? J'essaye de trouver une piste.

[Oka.mi]

En fait si ça ne marche pas c'est parce que le css de base fixe le height et le width à 128px.
Il faut forcer la chose avec

Code:

.avatar-big img {
   border-radius: 0 !important;
   width: 320px !important;
   height: 400px !important;
}

Au besoin, ajoutez une ligne object-fit: none; car actuellement la propriété est réglée sur "cover".
https://developer.mozilla.org/fr/docs/Web/CSS/object-fit

[crocnana]

C'est parfait. Merci beaucoup.