Проблема с границами в CSS в Google Chrome

Question

У меня проблемы с разными цветами границ и радиусом границ в css для моего сайта.

Я создал коробку и добавил границу к ее верхней части, как показано на рисунке ниже.

Тем не менее, я хотел, чтобы верхняя граница растягивалась на всю ширину рамки, но, похоже, это проблема. Эта проблема возникает только с Google Chrome на ПК, кажется, нормально в Safari и Internet Explorer.

#box {
    width:250px;
    height: 250px;
    background: #acacac;
    position: absolute;
    right:10px;
    top:315px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    border-top: 45px solid white;
}

Answer 1

Это проблема с границами CSS, и именно так вы создаете стрелки, которые вы видите в некоторых блогах.Это ограничение того, как вы можете создавать границы с закругленными углами.