The easiest way to see what's happening is to view an entry on the Marketplace which happens to have lots of items listed on the Content tab. Note that or some reason, people these days love to just add "boxes" or "HUDs" so the Content tab is essentially just one item. By contrast, old-school residents like your truly — and many of my favourite content creators! — correctly and legitimately list the actual contents of the inventory folder you'll get.
Here's an example: https://marketplace.secondlife.com/p/AlmaMiranda-Denim-Skirt-Tied-Top/22573321 (see also attached image #1, in case this item gets unlisted)
A little code inspection shows the issue (in this case at least): CSS class
inventory-contents
and the subsequent ones (e.g.,
contents-header
,
li.contents-body
, and so forth) are all correctly set to
display: flex;
. However, scrolling down, it can be seen that, although the sidebar o the right is also set to flex,
product-related-items
is not. Since
inventory-contents
is set to have a size of 334px (I didn't check if that's a computed value), this causes an overflow.
A quick & dirty fix is to simply set
product-related-items
to flex as well, while placing he height of
inventory-contents
set to
auto
. This fixes things, as image #2 shows (sorry about having to reduce things so much — I'm aware it's barely readable — but the point is that this is a
very long
inventory list, but the layout seems to be working fine).
Of course, this is a quick & dirty fix, but probably not the best solution; your web design team might prefer to add scrollbars or similar ways to avoid stretching the whole inventory list that far (or skipping the weird
hr
between the
li
— why not stick to a more standard way of placing row separators and get a more compact view?).
Also note that this might be related to the bug described by https://feedback.secondlife.com/web-bugs/p/bug-footer-in-store-pages-doesnt-align-with-content-container — although in
this
case, the footer seems to be fine.
Happy CSS bug hunting 😅