Login widget avatar size

Technical Details

Forum version : #phpBB2
Position : Founder
Concerned browser(s) : Mozilla Firefox, Google Chrome, Safari
Screenshot of problem : https://i.servimg.com/u/f82/16/02/93/28/captur11.png
Who the problem concerns : All members
When the problem appeared : A few months ago.
Forum link : http://testforum.lithuanianforum.net/

Description of problem

Hi all!

Long time ago I've installed a login widget on my forum. On this helpforum I found a CSS code which made avatars smaller than the actual size in order for an image not to stretch the widget. Code provided below worked all the time.

Code:

#gallery_container img[alt="avatar"] {height: 225px; !important;
width: 150px;
  }

Recently (about half an year or so ago) we did some coding to change username font size and to make navbar fixed on top of the forum. Sadly I can't specify if the problem occured right after we did the coding or later. But the fact is, as you can see from the screenshot I added, the code I used to resize avatar doesn't work anymore. It stretches the widget and makes it look bad aside the other widgets that are not stretched. To increase width of all the widgets is not an option for me.

Thank you for all the possible solutions.

hello

we can not inspect the element cause guests cant see the login widget

Hi,

here it is, I can see it as a guest. It shows avatar only when I'm logged in.


I can also provide you my login details, if you need it.

yes i can see it but we dont see the issue, the widget's width seems ok like this

yes please send me a test account via pm

Okay, PM sent, thank you

received thank you

try

Code:


table#gallery_container.forumline {
height: 225px; !important;
width: 150px;
  }


Sorry, that didn't worked

If I can get a login, I can try to help. But allow @skouliki to assist first.

sent the info to draxion he knows more than me

Thank you for your concern. Thank you both

If you want to specifically target that one image in the widget, use this css rule.

Code:

#gallery_container > tbody > tr:nth-child(2) > td > table > tbody > tr > td > div:nth-child(1) > img {
  width: 150px !important;
  height: 225px !important;
}

@Draxion brilliant as always. Thank you very much, it works. Solved!

You're very welcome!

Problem solved & topic archived. Please read our forum rules: ESF General Rules