Линейная проблема градиента CSS в Goolge Chrome Broswer версии 69.0.3497.100

Question

Я использую CSS-вкладку Gradient, но в браузере Chrome возникли проблемы

Старая версия и другой браузер работают нормально

Мой CSS

 body {
    background: #000;
}

.time-bar-block {
    display: flex;
}

.time-bar {
    border-right: 1px solid #545454;
    height: 41px;
}

.time-bar {
    background: #545454;
    background: -moz-linear-gradient(top, #999 1px, #000 1px, #000 5px, rgba(84, 84, 84, 0.8) 5px, rgba(84, 84, 84, 0.8) calc(100% - 5px), calc(100% - 5px), #000 calc(100% - 5px), #000 100%, #999 100%);
    background: -webkit-linear-gradient(top, #999 1px, #000 1px, #000 5px, rgba(84, 84, 84, 0.8) 5px, rgba(84, 84, 84, 0.8) calc(100% - 5px), calc(100% - 5px), #000 calc(100% - 5px), #000 100%, #999 100%);
    background: linear-gradient(to bottom, #999 1px, #000 1px, #000 5px, rgba(84, 84, 84, 0.8) 5px, rgba(84, 84, 84, 0.8) calc(100% - 5px), calc(100% - 5px), #000 calc(100% - 5px), #000 100%, #999 100%);
}

.time-bar .inner {
    width: 12.75px;
    height: 100%;
}

Firfox работает нормально

Проблема Google Chrome

Каждая проблема с 4 блоками

jsfiddle link https://jsfiddle.net/vo6L7jcz/17/