meetdilip Should work in theory, but tried several options for my phone (750px width) above and below this value however got no result. So pixel width is not the cause of this not working.

    Get me an example page where I can try. Or simply fetch the code from desktop version and put it with the mobile screen media query.

    This might help

    @media (max-width: 768px) {

.PostUser-avatar {
    left: -85px;
    position: absolute;
    width: 64px;
    height: 64px;
    border-radius: 64px;
    font-size: 32px;
    line-height: 64px;
    border: solid 2px green;
}
}

    Worked for me

    is there a way to change the "green online color" for the avatar?

    This ?

    .PostUser .UserOnline .fa-circle {
    color: green;
}
    a month later
    3 months later

    I think it's better to align those icons to the right side of the name, just like in Facebook groups.

    Pollux Badges on the right side of the username:

    .PostUser-badges {
    float: none;
    margin-left: 0;
    width: auto;
    }

    .PostUser-badges .Badge {
    margin-left: 10px;
    }

    how can we make it show on mobile

        6 days later

        BatuhanBakay how can we make it show on mobile

        My code was just a quick proof of concept, not a full-fledged solution. Take it as a starting point for further refinements, it wasn't meant to be anything more than that.