Issue with FormLayout with Aura, Firefox 140.16.0esr and Vaadin 25.2.8

Flow
1

Hello

I am experiencing a display issue with FormLayout using the Aura theme on Firefox 140.16.0esr (Windows) and Vaadin 25.2.8.

Firefox 140.16.0esr is used in my company.

I can reproduce the issue directly on the Vaadin documentation page: Form Layout component | Vaadin components

with Lumo:

image
image993×698 6.64 KB

with Aura

image
image1005×685 9.13 KB

On my application with Chrome(latest)

image
image1088×93 18.2 KB

On my application with Firefox 140.16.0esr

image
image1077×323 4.19 KB

Thanks

Eric

2

Hello, @oeil-de-nuit.

I confirmed the issue and filled a ticket in our repo Form layout fields not baseline-aligned in Firefox ESR 140 with Aura / base styles · Issue #12819 · vaadin/web-components · GitHub. The ticket offers a workaround for this bug that you may try out and see if it works for you:

vaadin-form-layout[auto-responsive] > *,
vaadin-form-layout[auto-responsive] vaadin-form-row > * {
  min-width: min-content;
}
vaadin-form-layout[auto-responsive][expand-fields] > *,
vaadin-form-layout[auto-responsive][expand-fields] vaadin-form-row > * {
  justify-self: stretch;
}
3

Note: Firefox ESR 140 is EOL in 6 days: Firefox | endoflife.date

4

Hello

It works well.

Thanks.

5

Thanks for the information @knoobie. Based on that, I downloaded the next ESR version (153.3.0esr) and tested it out, and I can’t see the issue anymore:

image
image1161×589 94 KB

6

Hello

Thanks for the information. I’m not familiar with my company’s Firefox update policy, so I don’t know when all the PCs will be updated. But it’s good news that it works with the upcoming ESR.

Eric.