Border color is a Chrome bug, or am I blind?

Question

This image should illustrate the problem well: ( full size )

As you can see, there is an error in the way Chrome handles border colors when using the border radius. There is a very specific crop, approximately when the aspect ratio of the window is 2: 1 or more.

You can imagine that in Chrome my tab system looks really bad ...

Is there any way to fix this behavior?

Real-time problem demonstration

Answer 1

I definitely didn’t decide, but this is a bit for comment.

The unit does not matter, it is the same as em , cm , ect.

 div.box1 { border-radius: 64px; border-bottom-left-radius: 0px; /* OR border-radius: 64px 64px 0px 64px; */ } 

It will work (the light bit stretches completely), but adding border-bottom-right-radius will turn it off again.

As soon as one of the border-bottom-XXX-radius gets below 62px , it stops.

I do not know if this will help to find the answer, but I hope it will be.

Answer 2

I'm sorry to tell you, I use an exclusive radius radius for 1 color. If, personally, I want such a border, I would make it a banking image due to browser differences.

I don't think this is the answer you were hoping for, but you can use it as a backup;)