the "Compare to" button design has slightly regressed on firefox only #17162

the "Compare to" button design has slightly regressed on firefox only (seems ok on chrome)?
here is how it looks on cloud and demo2 on FF:

but it used to look like https://matomo.org/wp-content/uploads/2019/10/Screenshot-from-2019-10-29-17-26-12.png

Would be great to restore the look. (as the calendar is very often used)

That actually looks fine for me locally and on demo2 using Firefox on Windows.
But to be honest the current layout isn't good at all, as it won't work for various languages besides of English, as Compare to: has longer translations. For German it's Vergleichen mit:, which is always too long and the layout "breaks"

I see what's happening here. The calendar itself positioned absolutely, without any width, so it uses the parent's width (which is too small, so grows to fit the period). If we see in smaller screen (<600px) actually it looks good (see screenshot), because we changing the positions above the calendar, so under 600px the parent element will be the whole top_controls class.

Easy fix is too set a fix width to the calendar (of course be careful with the mobile view and max-width).