Announcement

Collapse
No announcement yet.

How to make round avatars in vB5

Collapse
X
Collapse
First Prev Next Last
 
  • Filter
  • Time
  • Show
Clear All
new posts

    Originally posted by tenis View Post
    Hello,

    I used this code to make round avatars, I also forced avatars to be square 128x128 and biger.
    Everything is working fine on my 5.6.0 vBulletin forum, except little avatars (used as topic icons) that are not all circle but some are ovals.
    In postbit all avatars are circles.

    the additional CSS
    Code:
    /* Start Avatars without Borders */
    .avatar,
    .b-avatar,
    .b-avatar--thread {
    border: 0;
    }
    /* End Avatars without Borders */
    /* Big Avatars START */
    .b-userinfo .b-avatar, .b-userinfo .b-avatar img {
    max-height: 128px;
    max-width: 128px !important;
    width: 128px;
    height: 128px;
    }
    /* Big Avatars END*/
    /* Round Avatars START*/
    .avatar img,
    .avatar:not(.medium) > img,
    .b-avatar:not(.b-avatar--m) > img,
    .b-avatar--thread > img,
    .b-avatar--s > img,
    .b-comment .b-avatar img,
    .b-comp-menu-dropdown__trigger-avatar,
    .profile-sidebar-widget .profileContainer .profile-photo-wrapper .profile-photo,
    .b-avatar--pmchat,
    .b-pmchat__participants-avatar,
    img.avatar,
    img.b-avatar {
    border-radius: 100%;
    }
    .avatar,
    .b-avatar,
    .b-avatar--thread {
    border: 0;
    }
    .b-avatar--thread img {
    border: 1px solid #fff;
    }
    /* Round Avatars END*/

    Code:
    /* Big Avatars START */
    .b-userinfo .b-avatar, .b-userinfo .b-avatar img {
    max-height: 128px;
    max-width: 128px !important;
    width: 128px;
    height: 128px;
    }
    /* Big Avatars END*/
    this code works for big avatars on postbit for vbulletin 5.6.4
    thank you very much for the code

    Comment


      Originally posted by danielmorashov View Post

      Code:
      /* Big Avatars START */
      .b-userinfo .b-avatar, .b-userinfo .b-avatar img {
      max-height: 128px;
      max-width: 128px !important;
      width: 128px;
      height: 128px;
      }
      /* Big Avatars END*/
      this code works for big avatars on postbit for vbulletin 5.6.4
      thank you very much for the code
      Yes it blows them up, but they also become very grainy.

      Comment

      Working...
      X