Notifications
Clear all

wpForo 1.x.x [Solved] How to increase avatar appearance size in extended layout?

9 Posts
5 Users
3 Likes
778 Views
selsebil
Posts: 72
Topic starter
(@selsebil)
Estimable Member
Joined: 2 years ago

Hi, 

I want to increase avatar size in extended layout? Is it possible?

8 Replies
Chris
Posts: 2353
Admin
(@chris)
Support Team
Joined: 1 year ago

Hi @selsebil,

All the widths and heights must be the same numbers.

#wpforo #wpforo-wrap .wpfl-1 .wpforo-post .wpf-left .author-avatar {
    max-height: 80px;
    max-width: 80px;
}
#wpforo #wpforo-wrap .wpfl-1 .wpforo-post .wpf-left .avatar {
    width: 80px;
    max-height: 80px;
}
4 Replies
selsebil
(@selsebil)
Joined: 2 years ago

Estimable Member
Posts: 72

@chris It works perfect. Thank you.

Robert
Admin
(@robert)
Joined: 7 years ago

Support Team
Posts: 9912

@selsebil ,

If you check this on a mobile device, please use a new private/ incognito tab. Mobile browser has a hard cache and it's not possible to see css based changes without resetting the mobile browser cache in the browser settings.

selsebil
(@selsebil)
Joined: 2 years ago

Estimable Member
Posts: 72

@robert Thank you for answer. I tested it in incognito tab. I firstly deleted cache and tested in incognito tab but the result is same. Here is screen capture:

Kazuya_Fujimoto
(@kazuya_fujimoto)
Joined: 12 months ago

New Member
Posts: 1

@robert Thanks for the helpful answer. The information came in handy.

selsebil
Posts: 72
Topic starter
(@selsebil)
Estimable Member
Joined: 2 years ago

I guess there is no way to increase avatar size in desktop while keeping it normal in mobile. Thank you for your interest.

2 Replies
Tutrix
(@tutrix)
Joined: 3 years ago

Noble Member
Posts: 825

@selsebil 

add this to custom css

@media screen and (max-width:620px) {
#wpforo #wpforo-wrap .wpfl-1 .wpforo-post .wpf-left .avatar {
width: 70px !important;
max-height: 70px !important;
}
}

 

selsebil
(@selsebil)
Joined: 2 years ago

Estimable Member
Posts: 72

@tutrix Yes. You all are genius ❤️