• Résolu Positionnement des avatars dans la zone de commentaires


    Vendredi 16 Juin à 20:44
    Damstarr

    Bonjour à tous ! J'ai un petit soucis ^^, rien d'alarmant, c'est juste décoratif !

    J'aimerais que les avatars des commentaires sois placés à gauche du nom des visiteurs ! Autrement dit, à la place du numéro de commentaire. Cela est-il possible ? Je suis un peu novice mais j'apprends vite, du coup j'essaie de m'en sortir seul mais là je sèche !

    Merci pour votre aide !

    Vendredi 16 Juin à 22:03
    stormalo

    Bonjour,

    De mon point de vue, pour mettre l'image avatar à la place du numéro c'est quasi impossible en CSS.
    Les éléments affichés sont des sortes de boites virtuelles emboitées ou empilées. Le n° et l'avatar sont dans des "boites" différentes.

    Il est cependant facile de placer cette image à gauche, sous le n° du commentaire avec ce code css:

    .commentavatar {
        float: left;
        margin-right: 30px;     /* valeur 30 à adapter (décale le texte de l'image avatar)*/
    }

    Bonne suite

    Vendredi 16 Juin à 22:07
    Damstarr

    Merci Stormalo ! J'ai déjà essayé cette méthode mais le rendu ne me plait pas vraiment... suis difficile... Pas grave je me contenterais de ce que j'ai... merci encore

    Vendredi 16 Juin à 22:34
    stormalo

    Un résultat qui est peut être plus près de ton souhait: 

    Déplacer l'image vers le haut et le header du commentaire vers la droite. Pour finir, mettre la taille du numéro à la valeur 0px.

    Le css proposé devient:

    .commentheader {padding-left: 100px}
    .commentbody img {
        top: -35px;
        position: relative;
    }
    .commentnumber {
        float: left;
        width: 5px;
        font-size: 0px;
    }
    .commentavatar {

        float: left;
        margin-right: 30px;     /* à adapter */
    }

    Peut pas faire plus (je suis déjà surpris du résultat) yes

     

    Vendredi 16 Juin à 22:48
    Damstarr

    Whow génial Stormalo ! Tu as complètement résolu mon problème ( enfin, mon caprice...^^ ) ! Je vais bidouiller un peu les valeurs pour adapter au mieux cette solution... merci, Ö grand Stormalo !

     

    Oups ! Un soucis tout de même ! Du coup mes smileys de com montent de 35px aussi ! Peut on les supprimer ou seulement déplacer les avatars  ?

    Samedi 17 Juin à 22:19
    stormalo

    Bonsoir,

    Pas trouvé de smileys dans un commentaire, mais pas regardé partout. smile

    Par contre l'image avatar dans les réponses est tronquée.

    J'ai ensuite testé sur un blog en interne et effectivement il apparait une incidence sur les smileys.

    La dépendance css comm et réponses aux comm ne m'est pas très claire. En bricolant un peu je peux proposer un code qui maintien les smileys en place dans les réponses et n'affiche pas les images avatar dans ces réponses.

    Ça peut permettre de donner une autre piste pour trouver ton bonheur ..... he

    un copié-collé pour essayer sera plus utile que d'entreprendre une tentative d'explication

    /* modif liée à l'avatar    img avatar 0x0 + texte ajouté */
    .reply .commentpseudo {color: red ; background-color: yellow; margin-left: 10px}
    .replies .commentpseudo:before { content: " ➔ une réponse de  "}
    .replies [id*="comment"] a[href*="profile"] img{height: 0px; width: 0px;}
    .replies .commentavatar {margin-right: 150px;}

    /* principe précédent mais code modifié */
    .commentheader {padding-left: 10px}
    .commentbody a[href*="profile"] img {
        top: -35px;
        position: relative;
    }
    .reply .commentbody a[href*="profile"] img {
        top: 0px;
        position: relative;
    }
    .commentnumber {
        float: left;
        width: 5px;
        font-size: 0px;
    }
    .commentavatar {
        float: left;
        margin-right: 30px;     /* à adapter */
    }

    Pas possible de tester en simulation sur ta page de blog, un css externe semble en attente permanente ; j'imagine qu'il s'agit d'une police (?).
    En espérant que ton css réagira comme celui du blog que j'ai utilisé.

    Rien d'autres en magasin  . . .

    Samedi 17 Juin à 23:24
    Damstarr

    Bonjour Stormalo ! Merci encore pour cette amélioration ! J'avais résolu le problème en supprimant les smileys, mais là, pour le coup, c'est encore mieux... merci

    Mais tant que je te tiens j'ai un autre problème (promis c'est le dernier) ! Je n'arrive pas à afficher les avatars sur les block-reply. Saurais-tu comment y parvenir ?

    merci encore pour tout ce que tu fais.

     

    Ne t'embetes pas Stormalo ! J'ai désactivé le bouton de réponse comme ça je ne serais plus ennuyé à l'avenir ! Merci pour tout !

     

    Dimanche 18 Juin à 09:30
    stormalo

    Simple info concernant les avatars dans les réponses :

    ils étaient tronqués en hauteur et je n'avais pas de parade. Le code que j'ai imaginé les réduit à la taille zéro. et  les remplace à l'affichage par l'ajout du texte " ➔ une réponse de  " suivi du  pseudo de l'auteur de la réponse.

    Bonnes suites.




    Vous devez être membre pour poster un message.