Boxes on All Fandoms page don't properly clear each other when they are of unequal heights
Description
If you go to https://test.archiveofourown.org/media and the boxes are of unequal heights, you'll eventually end up with a box that should be in the left column appearing in the right column, with a big empty space on the left:
.media-index .listbox:nth-child(odd) { clear: left; } might fix it
The browser window width needs to be such that the fandoms are displayed in two columns and a box on the left needs to be taller than the box to its right. You most likely have to resize the window to achieve that. (For reference, for me this happens with all window widths between 880-1572px right now, but it might vary based on fandom sizes/fonts/etc)
There should not be a big empty space below the left box
Deploy notes
Skins/css need to be recached.
Attachments
6
Activity
Show:
choux
April 1, 2025 at 12:01 PM
resized boxes have no empty space below! all good for me.
Runt
April 1, 2025 at 10:53 AM
resized screen and boxes stayed in their correct order with no empty space on the left -
Ridicully
April 1, 2025 at 10:21 AM
Seems to be working as intended now.
Bilka
April 1, 2025 at 7:56 AM
Systems recached skins on staging around 10 hours ago.
If you go to https://test.archiveofourown.org/media and the boxes are of unequal heights, you'll eventually end up with a box that should be in the left column appearing in the right column, with a big empty space on the left:
.media-index .listbox:nth-child(odd) { clear: left; } might fix it
Testing
Open the All Fandoms page (https://test.archiveofourown.org/media)
The browser window width needs to be such that the fandoms are displayed in two columns and a box on the left needs to be taller than the box to its right. You most likely have to resize the window to achieve that. (For reference, for me this happens with all window widths between 880-1572px right now, but it might vary based on fandom sizes/fonts/etc)
There should not be a big empty space below the left box
Deploy notes
Skins/css need to be recached.