1428998 - Vertical line on css triangles

Status: RESOLVED INCOMPLETE

(Firefox :: Untriaged, defect)

Description

[Mohammad]

Attachment: 5a82beaa-eb31-4afe-9191-46d9d7ca5992.png

User Agent: Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:57.0) Gecko/20100101 Firefox/57.0
Build ID: 20180104112904

Steps to reproduce:

I created triangles with css
please check this code :
&::before{
                    content: '';
                    position: absolute;
                    height: 0;
                    border-style: solid;
                    border-width: 0 100px 200px 100px;
                    border-color: transparent transparent $yellow transparent;
                    z-index: 2;
                }


Actual results:

On triangles i saw vertical lines

Comment 1

[Mohammad]

look the attachment, near laptop is a green line !

Comment 2

[Ciprian Muresan [:cmuresan], Formerly of Ecosystem QA - please needinfo @mcoman for things regarding the team]

Hi Mohammad,

I have tested the issue you are experiencing on Firefox 57.0.4 and Nightly 59.0a1 (Build ID 20180114220708) on Windows 10 x64, Mac 10.12, Arch Linux x64 and Debian 9.2.1 and I was unable to reproduce the issue.

In my case I was able to draw the triangle and no extra lines appeared inside it. I've used: https://www.w3schools.com/code/tryit.asp?filename=FNHL2HTWTKG6 as a test.

Could you please share all of the page that you are working on or make a reduced test case using https://jsfiddle.net/?

Comment 3

[Ciprian Muresan [:cmuresan], Formerly of Ecosystem QA - please needinfo @mcoman for things regarding the team]

Marking this as Resolved - Incomplete due to the lack of response from the reporter.
If anyone can still reproduce it on the latest versions, feel free to reopen the issue and provide more information.