"More Topics" container "Suggested" or "Related" selected item border intrudes into elements below it

AI-generated summary

More Topics Container Issue: A visual issue is reported where the selected item border in the “Suggested” or “Related” dropdown container intrudes into elements below it. rahim123 shared a screenshot and a temporary CSS fix. However, chapoi was unable to reproduce the issue. rahim123 provided additional screenshots from different browsers and suspects the issue is related to font size and/or scaling settings at the OS level, similar to a previous bug report. chapoi also tried to reproduce the issue by adjusting zoom and font size, but was unsuccessful.

Hi there, this issue is even more noticeable on my own instance, but it’s also visible here on Meta:

I worked around it for now with:

.more-topics__container .nav li .btn { /* Private messages "Related" and "Suggested" selected border was intruding into elements below */
    padding: 0em .65em;
}
2 Likes

I’m afraid I can’t repro this on meta.

Do you still see the issue?

1 Like

Hi there, thanks for looking into this. Yes, I do still see the issue:

With Chromium:

With Firefox:

I suspect that the issue has something to do with very specific font size and/or font scaling settings at the OS level. I saw something similar with this bug report:

The difference in this case with the “Suggested” or “Related” border is that changing the zoom level and/or my OS text scaling value to normal defaults makes no difference.

Hmm, I also tried playing with zoom and font-size, including on firefox, but no luck so far (to repro)…