6

Hat in profile image gets cut like the following image:

Stackoverflow profile image overflow hidden

I've inspected the element:

<div class="gravatar-wrapper-32 wb-hat-checked">
  <div class="hat" style="float: left; display: block; width: 0px; height: 0px; overflow: visible; position: relative; left: 6px; top: -6px;" data-hatid="9828326">
     <img src="data:image/svg+xml, ---omitted---" width="19" height="18" style="display: block;">. 
  </div>
  <img src="https://i.stack.imgur.com/jMC4J.png?s=64&amp;g=1" alt="" width="32" height="32" class="bar-sm">
</div>

CSS for gravatar-wrapper is like this:

class*="gravatar-wrapper-"] {
    padding: 0;
    overflow: hidden;
}

Changing overflow:hidden to overflow:visible shows avatar correctly.

Improve this question
3
  • 2
    I remember bug reports in previous years about hats overlaying other content in the page so presume it is a fix for that, feature rather than bug
    – Martin Smith
    Dec 25, 2020 at 18:23
  • 1
    @MartinSmith But hats are showing correctly in other places
    – glinda93
    Dec 25, 2020 at 18:25
  • Oh right, probably not deliberate then if it is just the profile page and not QA pages
    – Martin Smith
    Dec 25, 2020 at 18:26

0

Reset to default

You must log in to answer this question.

Browse other questions tagged .