New issue
Advanced search Search tips

Issue 864367 link

Starred by 1 user

Issue metadata

Status: Available
Owner: ----
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: Linux , Android , Windows , Chrome , Mac
Pri: 2
Type: Bug



Sign in to add a comment

Dashed and dotted borders with border radius are not spaced evenly

Reported by foolmo...@gmail.com, Jul 17

Issue description

UserAgent: Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.99 Safari/537.36

Steps to reproduce the problem:
1. Add a dashed/dotted border to any div
2. Add a border-radius greater than 10px
3. That's it
Ex: http://jsfiddle.net/cdr218jt/3/

What is the expected behavior?
Dots/dashes spaced evenly around the curved corners of the div

What went wrong?
The top left corner of the div has the dots/dashes too close to each other

Did this work before? N/A 

Does this work in other browsers? Yes

Chrome version: 67.0.3396.99  Channel: stable
OS Version: 6.1 (Windows 7, Windows Server 2008 R2)
Flash Version: 

This bug looks related, but it said it was fixed already...?
https://bugs.chromium.org/p/chromium/issues/detail?id=766977
 
Labels: OS-Android OS-Chrome OS-Linux OS-Mac
Status: Available (was: Unconfirmed)
Things were improved with the referenced change, but this issue remains due to the way we break up and render borders. It's very hard to fix, I think, but I can take a look at some point.
Labels: Needs-Triage-M67
Thanks! I wouldn't think it was too difficult of a problem but I have no idea how the border rendering is setup. I'll try checking it out sometime as well, if I can figure out all these hoops you have to jump through to contribute code here...

Sign in to add a comment