1736475 - CSS Linear gradient leaves a white line on Firefox only

Status: UNCONFIRMED

(Core :: Layout, defect)

Description

[nope]

Attachment: FirefoxGradient.png

User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:93.0) Gecko/20100101 Firefox/93.0

Steps to reproduce:

<div class='example'></div>
.example {
width:100%;
height:200px;
background: linear-gradient(to left, lightblue, blue, lightblue)
}

Actual results:

At certain browser widths, the gradient breaks and leaves a white line.
Tested on Edge and Chrome - both of these browsers work fine
It is at several widths that it will break.

Expected results:

There shouldn't be a white line in the middle of the gradient

Comment 1

[BugBot [:suhaib / :marco/ :calixte]]

The Bugbug bot thinks this bug should belong to the 'Core::Layout' component, and is moving the bug to that component. Please revert this change in case you think the bot is wrong.

Comment 2

[Virginia (please send need info request to Brindusa Tot)]

Hi Nope,

I tested this on my end on these Firefox versions: Release 93.0 (64-bit), Beta 94.0b8 (64-bit) and Nightly 95.0a1 (2021-10-21) (64-bit) but I was unable to reproduce the white line. I have a Windows 10 laptop with a 14-inch screen. I also tried resizing the browser window and zooming in and out.

What kind of monitor are you using? Could you specify if this happens at a specific browser width?

Thanks in advance,
Virginia

Comment 3

[Emily McDonough [:alaskanemily]]

I was not able to reproduce this using Nightly 96 on OS X. Can you recreate this with a specific width set via CSS to reproduce with?

Comment 4

[Hiroyuki Ikezoe (:hiro)]

Attachment: The test case in comment 0

I don't see the issue on my Linux either. I am attaching the test case as an HTML file (since I can't open the data URL directly).

Comment 5

[Hiroyuki Ikezoe (:hiro)]

Though I haven't been able to reproduce the issue locally, I am setting S3 for now.

Comment 6

[BugBot [:suhaib / :marco/ :calixte]]

Clear a needinfo that is pending on an inactive user.

For more information, please visit auto_nag documentation.