Could you see the attached photo
There is some avatars which is not in the center (there is empty space in the right)
This is my dpta.css & the icon size= 42x42 px
Code:
.threadbit .threadstatus.avatars {
background:transparent none no-repeat 0 0 !important;
width:{vb:math {vb:stylevar threadbit_iconsize.width}-6}px !important;
height:{vb:math {vb:stylevar threadbit_iconsize.width}-6}px !important;
padding: 2px;
min-height:{vb:math {vb:stylevar threadbit_iconsize.width}-6}px;
overflow:hidden;
margin:5px 10px 6px;
border: 1px solid #A5CAE4;
border-radius:4px;
}
.threadbit .threadstatus.avatars img.icon {
min-height:{vb:math {vb:stylevar threadbit_iconsize.width}-6}px;
}
.threadbit.hot .threadstatus.avatars {
box-shadow:0 0 0 1px #777, 0 0 3px 2px {vb:stylevar dpta_shadow_hot_color};
-webkit-box-shadow:0 0 0 1px #777, 0 0 3px 2px {vb:stylevar dpta_shadow_hot_color};
}
.threadbit .icon {
opacity:0.7;
filter:alpha(opacity=70);
}
.threadbit.new .icon {
opacity:1;
filter:alpha(opacity=100);
}
.threadbit img.self {
max-width:20px;
max-height:20px;
background:#fff;
border: 1px solid rgb(206, 206, 206);
padding:1px;
border-radius:2px;
position:absolute;
top:{vb:math {vb:stylevar threadbit_iconsize.width}-15}px;
right:{vb:math {vb:stylevar threadbit_iconsize.width}-6}px;
}
.threadbit.lock .lockicon {
position:absolute;
top:2px;
right:7px;
width:20px;
height:20px;
background:URL(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAUCAYAAABSx2cSAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAuFJREFUeNqklF9IU3EUx7/7c7dd3dza5h+2aUYlS9AeSlPBfEiUSAtMxAeFoBZU2kOYTxFWFPhSlk9i4EtlFIi9lgMtqBfFcNjsISrUMHPrzn/bvd7tdn5jkyvSSx343N89957v75x7fr/f1SiKgn81PbtoNJq0z24yCBfhJixEjPhBLBBrRGKHWCV0Go3GE1VVlZ3l5WWHwuEw77A7xGBwbn58YmIwEomMUswiEU8qVGXbeJPJ19vbG5qanFQu+nybRUUHVxobG1b9/jFl+NnTjWyn8w7F5W2nS4m1RFV7W9vCo4d9itvtniH/AnGSaLVara+ud3VJ3d1dAvmnCaNabKaAG7dv9cQLCvK/kl9H8Kn5OaLUZrONd3ZcUfI9ntFUP5IZmVlIfIwapxWEyAfyA0Q09W6L+CKKon91dU3ZY7eXkG9Xi00cp7fKsgy9XhdWCdMmUYWRRCKe0Om0hnTZ6W5nSJJkptkhilIh+ZXEunpJaeJiNnk8nmz0DnF2dfXxvUfLytHcvFxBGY7wPK/hOA5MEIvF2Kipr6/TObNzsmZmAha12NHU1GSpra2Fy+VysE1DDYLZbEY0GoUgCKDK4PV6kZubZ+rv789UizmWgQUwmHhjYyM5sqwM9px9Fosj0+3YYQaDgeCoYRy24nrISiYUbSZ4XkvfKWNL1iAq6qHAgF3b883YBGaD3xFe+oj6ChlujxaBgA4jfhkhQUJjjQElOfsghTZ3iz0ZbxH+Noa+wVkMDQFXW4HOFqCoAegZAG7eMyIw7UTZYde2OL3OWPwFdDTHEHgOXDoL3H8CFJwCBkaAB9eAd4+1iEVj6B8Wd2WOe7ztCMr7YTBNoeWcgpozRkx/5qhkGS/mZFSWcui5ewD+9ys477ucUIuXIsJPcX7BonwKSoqeM8Bm5WDN4qmJEn4LW3j5eh2Fe0OacGiZpV5KnmF2MGhJHHRfTOSmzvXfTEkJg0QI//Mb+iPAADsYK/mrQU8kAAAAAElFTkSuQmCC) top right no-repeat;
}
.threadbit .threadstatus.avatars div.overlay {
position:absolute;
top:2px;
right:2px;
width:32px;
height:32px;
background:URL(data:image/png;base64,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) top right no-repeat;
}