1895485 - width: calc(25% - 1em) calculates wrong in some situations (worked until FF 115)

Status: RESOLVED DUPLICATE of bug 1893127

(Core :: CSS Parsing and Computation, defect)

Description

[Marco [:lubber] Wienkoop]

Attachment: firefoxwidth25precentminus1em.gif

User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/123.0.0.0 Safari/537.36

Steps to reproduce:

• open https://jsfiddle.net/lubber/qcght26s/9/
• Try to resize the the bottom right render area of the jsfiddle and watch the orange element positions

Minimal reproducable example code

.fourcolumns {
  display: flex;
  flex-wrap: wrap;
}
.fourcolumns .column {
  width: calc(25% - 1em);
  background: orange;
  margin: 0.875em 0.5em;
}

<div class="fourcolumns">
  <div class="column">
    Column
  </div>
  <div class="column">
    Column
  </div>
  <div class="column">
    Column
  </div>
  <div class="column">
    Column
  </div>
    <div class="column">
    Column
  </div>
</div>

Actual results:

Firefox 125 sometimes moves the fourth column into the second row. (will eventually happen when resizing the window)
Every browser (chromium based) and also Firefox <=115 displays 4 columns in the first row all the time as expected

Expected results:

four rows should be displayed all the time, regardless of viewport /window size

Comment 1

[Jonathan Kew [:jfkthame]]

I can't seem to reproduce this; I tried on both macOS and Windows, and I'm consistently getting the expected 4 columns no matter how I resize the render panel.

The reported issue seems like it could be related to rounding errors in the computations somewhere, but if so, I don't know why I can't reproduce.

Marco, can you try with a new Firefox profile, and/or running in Troubleshoot Mode (see the Help menu), and confirm whether you still see the issue?

Comment 2

[Marco [:lubber] Wienkoop]

I just tried troubleshoot mode and the issue still persists.

BUT: I played with browser scaling (CTRL+/-/mousewheel) (i usually have 120% on my notebook).
When i switch to 100%, the issue does not seem to happen, but it does happen on 80%, 90%, 110%, 120% ...

Comment 3

[Marco [:lubber] Wienkoop]

Attachment: firefoxwidth25precentminus1em_scaling.gif

Showing issue exists for scaling only

Comment 4

[Alice0775 White]

I think this is due to the patch for Bug 1881220 that landed in 125.0.
And the offending patch for Bug 1881220 has been backed out from beta126 and nightly127.0a1.

Comment 5

[Marco [:lubber] Wienkoop]

Thanks! I can confirm the issue is gone in FF Nightly 127.0a1