itch.io

For the user tools I inject

You want to pin it to the top? you can try absolute positioning instead:

#user_tools { position: absolute; }

But when this happens, the screenshots scroll sideways in a box and are above the text too.

That is just itch’s responsive design, I suppose. No spaces to the side to place the screenshots, so on top it is.

When the standard css pushes the tools above the page and flattens them, that might be better.

If you prefer that, but doesn’t want the screenshot sideways, it is possible:

.user_tools {
  position: static;
  margin: 0;
  white-space: nowrap;
  text-align: left;
  padding: 8px 0 8px 10px;
  overflow: auto;
  background: var(--itchio_ui_bg_dark, #2b2b2b);
  width: 100vw;
  box-sizing: border-box;
  box-shadow: inset 0 5px 5px -5px rgba(0,0,0,0.5);
}
.user_tools > li {
  display: inline-block;
  vertical-align: top;
  margin: 0 10px 0 0;
}

That is the CSS from itch’s default mobile layout. But without the media query, so you’ll always have the user tools on top, on desktop too.

edit: removed some duplicate CSS properties.