Consider constraining the height of the messagepane

[phiw13]

… to prevent the messagepane to grow taller than the viewport - example: people uploading many images at once. OP in this forum thread - https://forum.textpattern.com/viewtopic.php?id=52037 - uploads upwards of 40 imagea at once.

Suggested code (as used in a custom.css file for testing):

/* .messagepane */
#messagepane {
  inset-inline-start: 4vw;  /* logical prop -> RTL/LTR */
  inset-inline-end: auto; /* override Hive stylesheet - for testing */
  max-width: 92vw; /* prevent endless width when faced with long strings */
}

/* .messagepane > span */
#messagepane .messageflash {
  overflow: auto;
  max-height: 80vh;
  position: static; /* override Hive stylesheet - for testing */
}

.close .ui-icon {
  bottom: min(50%, 20vh); /* never farther away from bottom than 20vh */
  top: auto; /* override Hive stylesheet - for testing */
}

Demo using Sandspace theme: https://dev.l-c-n.com/txp/txp-sandspace-messagepane_long.html

[phiw13]

Better positioning for the close icon:

.close .ui-icon {
  margin: 0 !important;
  bottom: min(50% - 4px, 20vh); /* never farther away from bottom than 20vh */
  top: auto !important; /* override Hive stylesheet - for testing */
}

(!important used to override the default stylesheet while testing)

[phiw13]

FWIW The styling (positioning) would fix the current incorrect position of the close button (after Oleg changed it from a <a href> to <button />).