Page MenuHomePhabricator

Button changes height when message below text input is displayed
Closed, ResolvedPublicBUG REPORT

Description

Steps to replicate the issue (include links if applicable):

  • Create a text input element inside a field to be able to display messages.
  • Display a toggle button outside of the field.
  • Trigger a message, that shows up below the input field.

What happens?:
The button changes its height.

Screenshot from 2023-10-26 15-14-43.png (128×893 px, 17 KB)

What should have happened instead?:
The button should not change its height.

Software version (skip for WMF-hosted wikis like Wikipedia):

Other information (browser name/version, screenshots, etc.):
Example code: https://gerrit.wikimedia.org/r/c/mediawiki/extensions/FileImporter/+/965769/

Event Timeline

It looks like this happens because the FileImporter code uses flexbox to put the Field and the ToggleButton next to each other, and that causes the button to grow its height to match the height of the Field. Setting height: 100%; on the button should fix this.

WMDE-Fisch subscribed.

Thanks we found a different solution. It was defenitly on our end of the code :-).