The discussion revolves around a spacing issue on user profiles. nexo initially reported two bugs: a massive gap of empty space above a user’s profile image, and profile pictures overlapping text and properties when users have no background image. tshenry suggested checking the issue in safe mode and provided a CSS fix for the overlap issue.
After troubleshooting, nexo found that safe mode didn’t resolve the issue, but removing all CSS did not fix it either. The issue seemed to be inconsistent, only occurring with some users who have background images. nexo continued to investigate but was unable to find the cause.
tshenry eventually reproduced the issue on Meta and provided a temporary CSS fix. The root cause was determined to be related to the absence of the div.staff-counters element when a user profile background image is present. nexo thanked tshenry for resolving the issue. Later, tshenry mentioned that the user profile has been reworked in core, and the temporary CSS fix can be removed to avoid breaking the mute/ignore pop-up on profiles.
1st Bug: when visiting a user’s full profile, there is a massive gap of empty space above it between the user’s image and the header.
2nd bug: users with no background image - their profile picture sticks out of the user card and is seen overlapping text and properties behind it.
I imagine this is due to a customization you’ve made or a theme component you use. I can’t repro here on Meta. Check to see it still happens after disabling themes at your site’s /safe-mode page.
This is one of those “feature-not-bug” things. It’s supposed to be a nice, modern looking style, but if you don’t like it you can adjust with CSS:
#user-card.no-bg .card-content,
#group-card.no-bg .card-content {
margin-top: 50px;
}
Safe mode didn’t fix it, but I’m still looking into it. Website is https://blinqchat.com
I found this CSS with the div container: (I didn’t add this code)
I’ve fallen, I can’t find where and why this bizarre issue came from. With safe mode I disabled all plugins and themes and yet the issue persists. I removed the plugins I’ve installed since this issue started (I believe today or for a few days) - no luck. Sigh.
Ah ha! I figured out how to reproduce it on meta. Thanks for trying everything first @nexo. If you need a quick and dirty “fix” this should help, but this will need to be fixed properly in core:
.user-main .about {
overflow: hidden;
}
@awesomerobot here is the repro criteria I’ve determined at this point:
div.staff-counters element displayed (this is the key)THANK YOU 
I appreciate you working with the issue, you’re awesome!
Just a heads up. The user profile has been reworked in core, so assuming you are up to date, you can go ahead and remove that CSS. If you keep it around, it will end up breaking the the mute/ignore pop-up on profiles.
This topic was automatically closed after 24 hours. New replies are no longer allowed.