VideoJS自定义显示持续时间和当前时间重叠

Question

我是通过修改相关的css设置来显示皮肤中视频的总持续时间和当前时间，如图所示：

但是，当总时间超过一小时时，我目前面临着时间显示重叠的问题。

看到这个：

视频重叠的当前时间和总时间长视频。

任何人都可以帮我解决这个问题吗？ 可以只用CSS完成，或者我必须根据时间使用JavaScript来改变等等。

用于显示视频时间的CSS：

.vjs-sublime-skin .vjs-current-time{
display: block;
margin-top: 5px;
position: absolute;
right: 155px;
margin-left: auto;
margin-right: auto;
}
.vjs-sublime-skin .vjs-time-divider{
display: block;
margin-top: 5px;
position: absolute;
right: 148px;
margin-left: auto;
margin-right: auto;
}
.vjs-sublime-skin .vjs-duration{
display: block;
margin-top: 5px;
position: absolute;
right: 125px;
margin-left: auto;
margin-right: auto;
}

此致