Topic: [BUG] Images with resolutions significantly taller than wide do not show the rating

Posted under Site Bug Reports & Feature Requests

Bug overview description.
When an image is much taller than it is wide, the rating for the image does not appear on the thumbnail.
What part(s) of the site page(s) are affected?
Image searches.
Example: id:716559
What is the expected behavior?
Every thumbnail containing its rating.
What actual behavior is given instead?
The area is not wide enough to contain all the data normally listed and the rating does not show.
Can you reproduce the bug every time?
Yes.
What steps did you take to replicate this bug?
I just searched boss_monster and happened to see it multiple times on the same image when searching backwards.
Errors or other messages returned (if any).
No errors aside from missing rating. Rating is still visible on the post page itself. Only the thumbnail is missing it.

Updated

A side effect of trying to make the stat panel the same width as the thumbnail. Too many digits = some get pushed out of view. It does seem to have a minimum width of ~50% but many at the width do have the last characters cut off due to displaying large numbers. From your example:

What's there: ↑119 ♥448 C12 Q
What's shown: ↑119 ♥448 C1 (though the 2 may appear depending on your browser's zoom settings)

More examples.

Updated by anonymous

Same here, shows as C1.

I will play with the CSS and try to fix this issue.

Updated by anonymous

Option 1: Turn off overflow:hidden on post-score class.

This causes the text to continue outside the box which looks dumb.

Option 2: Change overflow:hidden to overflow:auto.

Adds a scrollbar underneath which looks dumb.

Option 3: Remove display:block from element or change it to display:inline.

This is better, but it can cause other ones to shrink. The box will be the size of the text no matter what.

Option 4: Change display:block to display:ruby-text.

Same as above but looks better on Firefox. May be non standard behavior.

Updated by anonymous

Option 5: Remove white-space:nowrap from post-score class.

This could be the best option so far, still testing.

Edit: Go to rainbow_mika tag search. Find post #716559 thumbnail, 13th to last thumbnail near the bottom. Turn off white-space:nowrap on the .post-score class in your HTML Inspector. Only that thumbnail is affected and the row spacing does not change, at least on Firefox.

This seems to be best.

Updated by anonymous

What about min-width for the part the text is contained in? It would expand to fit the text and if done behind the image with z-index you can keep it even.

Updated by anonymous

  • 1