[ModernBB] Taille avatar du dernier posteur

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu [ModernBB] Taille avatar du dernier posteur

Message par SweetGumiho le Ven 28 Avr 2017 - 3:36

Détails techniques


Version du forum : ModernBB
Poste occupé : Administrateur
Navigateur(s) concerné(s) : Google Chrome, Autre
Capture d'écran du problème :
Voir l'image:

Personnes concernées par le problème : Moi uniquement
Lien du forum : http://dayzgonetest.forumactif.com

Description du problème

Bonjour/Bonsoir chers amis de Forumactif !

Mon problème est le suivant : je n'arrive pas à adapter le fond de l'avatar en page d'accueil à la modification de la taille via le CSS.
Code:
.lastpost-avatar {
float: left;
padding: 2px;
}
.lastpost-avatar img {
width: 50px;
height: 80px;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}
Quelqu'un aurait une idée sur la question ?

Merci d'avance et passez une bonne journée/soirée. ♥


Dernière édition par SweetGumiho le Sam 29 Avr 2017 - 23:41, édité 1 fois
avatar

SweetGumiho
****

Féminin
Messages : 400
Inscrit(e) le : 11/10/2014

http://dayzgonetest.forumactif.com
SweetGumiho a été remercié(e) par l'auteur de ce sujet.

Résolu Re: [ModernBB] Taille avatar du dernier posteur

Message par MasDan le Ven 28 Avr 2017 - 6:26

Bonjour,

Pour obtenir un avatar rond, il faut:
1) ligne 6-7 : la valeur pour le height et le width doit être identique.
2) ligne 8, 9 et 10: remplacer le 5px par 50%.
avatar

MasDan
Aidactif
Aidactif

Masculin
Messages : 1102
Inscrit(e) le : 24/05/2011

http://projetAumMdn.forumactif.com
MasDan a été remercié(e) par l'auteur de ce sujet.

Résolu Re: [ModernBB] Taille avatar du dernier posteur

Message par SweetGumiho le Ven 28 Avr 2017 - 9:31

Je ne cherche aucunement à avoir un avatar rond mais bien garder sa valeur rectangulaire pour éviter de voir celui-ci déformé (la taille règlementaire de tous les avatars du forum étant de 200 pixels de largeur par 320 pixels de hauteur réduit aux trois quarts j'obtiens bien 50 par 80 pixels). Ce que je souhaiterais donc est de voir le fond s'adapter de la même manière pour encadrer cette apparence rectangulaire. Merci. ^^
avatar

SweetGumiho
****

Féminin
Messages : 400
Inscrit(e) le : 11/10/2014

http://dayzgonetest.forumactif.com
SweetGumiho a été remercié(e) par l'auteur de ce sujet.

Résolu Re: [ModernBB] Taille avatar du dernier posteur

Message par MasDan le Ven 28 Avr 2017 - 17:36

Si vous rechercher cette effet


Il faut ajouter le box-shadow (cadre bleu).
avatar

MasDan
Aidactif
Aidactif

Masculin
Messages : 1102
Inscrit(e) le : 24/05/2011

http://projetAumMdn.forumactif.com
MasDan a été remercié(e) par l'auteur de ce sujet.

Résolu Re: [ModernBB] Taille avatar du dernier posteur

Message par SweetGumiho le Sam 29 Avr 2017 - 0:05

C'est l'idée mais possible de reprendre exactement le même box-shadow que celui de base ? Parce que j'ai l'impression que c'était plus foncé en bas et plus clair en haut (dégradé ?).
scratch

EDIT : Après avoir fait un zoom sur le fond en cercle de base je n'ai pas l'impression que ce soit un box-shadow, ou alors pas uniquement...
reflexion

J'ai trouvé ce code qui correspond mais je ne sais pas comment l'arranger pour que ça cadre bien :
Code:
.lastpost-avatar:after {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    background: rgba(0,0,0,0.1);
    border-color: #FFF;
    border-radius: 38px;
    border-style: solid;
    border-width: 2px;
    box-shadow: 0 1px 1px rgba(0,0,0,0.3), 0 0 1px rgba(0,0,0,0.3);
    content: "\f47e";
    display: block;
    font-family: Ionicons;
    font-size: 1.8rem;
    font-style: normal;
    font-variant: normal;
    font-weight: 400;
    height: 38px;
    left: 0;
    line-height: 34px;
    position: absolute;
    speak: none;
    text-align: center;
    text-rendering: auto;
    text-transform: none;
    top: 11px;
    width: 38px;
}

Ma feuille de CSS actuelle :
Code:
#site-desc p {display:none;
}
a.mainmenu[href="/groups"] {
  display: none;
}
.postprofile-avatar img{
height: 320px !important;
width:  200px !important;
margin-top: 35px !important;
border-radius: 100px !important;
-htm-border-radius: 100px !important;
-o-border-radius: 100px !important;
-moz-border-radius: 100px !important;
-webkit-border-radius: 100px !important;
}
.lastpost-avatar {
float: left;
padding: 2px;
}
.lastpost-avatar img {
width: 50px;
height: 80px;
border-radius: 50px;
-moz-border-radius: 50px;
-webkit-border-radius: 50px;
}
.lastpost-avatar:after {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    background: rgba(0,0,0,0.1);
    border-color: #FFF;
    border-radius: 50px;
    border-style: solid;
    border-width: 2px;
    box-shadow: 0 1px 1px rgba(0,0,0,0.3), 0 0 1px rgba(0,0,0,0.3);
    content: "\f47e";
    display: block;
    font-family: Ionicons;
    font-size: 1.8rem;
    font-style: normal;
    font-variant: normal;
    font-weight: 400;
    height: 80px;
    left: 1;
    position: absolute;
    speak: none;
    text-align: center;
    text-rendering: auto;
    text-transform: none;
    top: 1px;
    width: 50px;
}
avatar

SweetGumiho
****

Féminin
Messages : 400
Inscrit(e) le : 11/10/2014

http://dayzgonetest.forumactif.com
SweetGumiho a été remercié(e) par l'auteur de ce sujet.

Résolu Re: [ModernBB] Taille avatar du dernier posteur

Message par MasDan le Sam 29 Avr 2017 - 19:11

Est-ce que ceci est mieux?



Code:
box-shadow: 1px 1px 0 1px rgb(197, 197, 197), -1px -1px 0 1px rgba(197, 197, 197, .3);
avatar

MasDan
Aidactif
Aidactif

Masculin
Messages : 1102
Inscrit(e) le : 24/05/2011

http://projetAumMdn.forumactif.com
MasDan a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: [ModernBB] Taille avatar du dernier posteur

Message par SweetGumiho le Sam 29 Avr 2017 - 23:41

Merci à toi. Sujet résolu. merci
avatar

SweetGumiho
****

Féminin
Messages : 400
Inscrit(e) le : 11/10/2014

http://dayzgonetest.forumactif.com
SweetGumiho a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum