I noticed a little (very minor) flaw when hovering over the left-hand side buttons for up-/downvote, bookmark and activity found next to every question and answer.
The Problem
The popover-tooltips of these buttons all vertically line up just fine - except for the last one. The "button" for "Show activity on this post" has a smaller width, resulting in the tooltip being displayed closer to this one "button" than the other ones.
Or, alternatively, a direct comparison between the tooltips and the one above it in one picture:
This is a very minor visual design flaw, but it's noticeable. I tested this in current versions of Firefox and Chromium.
Reason
In the above paragraph, I put "button" in quotation marks, because the "button" for "Show activity on this post" actually is an anchor (a
) and not a button (button
) like the other ones. This is semantically correct use of HTML, as a button should trigger some action on the loaded page and an anchor should instead "navigate" somewhere (another page or area of a page). But as a result, the width of this element (the anchor) differs from the width of the buttons above. It's tooltip is therefor out of line with the other ones.
Possible solution
Adding the CSS property width: 100%;
to the anchor (<a class="js-post-issue grid--cell s-btn
...) solves this, but I am not sure whether specifying width
for an anchor is good style. Maybe there's a better solution.
PS: I hope this way of reporting such things is okay, I relied on this question from 8 years ago.