chrome中的css边框太厚

我有一个问题，只发生在谷歌浏览器。边界似乎“太厚”。在Firefox中，一切都很正常（到目前为止，我只在chrome和Firefox中进行了测试）

如图所示，存在两个问题：

1） 上箭头：边框太厚（为1px实心#aaa）。当我用css绘制表格时，边框是正常的。这只发生在div和表单输入字段中

2） 下箭头：内部div的背景略高于外部div的边界

这可能是Chrome中的一个bug吗

.outer-div{
    border: 1px solid #aaa;
    box-sizing: border-box;
}
.outer-div > .inner-div{
    padding: 5px;
    background: linear-gradient(#eee,#ddd);
}

编辑：生成下箭头指向的结果的代码

.calendar-events-block{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    margin: 15px 0;
    border: 1px solid #aaa;
}

.calendar-events-block > .events{
    flex: 1 1 auto;
}

.calendar-events-block > .events > .title{
    padding: 10px;
    font-weight: 700;
    border-bottom: 1px solid #aaa;
    background: linear-gradient(#eee,#ddd);
}

编辑2：如果我缩小到90%，一切看起来都很正常（就像在Firefox中）

编辑3：有问题的JSFIDLE（）

编辑4：有趣的细节：当我放大或缩小时，“溢出”（标题背景越过边框）的问题消失了

另一个屏幕截图：

---

左边是一张桌子，右边是一些沙发。表的边框=1px solid#aaa，divs的边框=1px solid#aaa，但是tabel边框比div边框薄得多。

因为这只发生在chrome中，可能与chrome的默认样式有关。尝试将css重置添加到文档或尝试添加

* {
border: none;
}

---

你的身体。

这似乎是一个太低的问题，所以内部元素在边界之上，我想，你能分享一个产生问题的代码吗？我添加了代码。哦，你的用户名：“。@DavidThomas lol:p你想过一个系统错误吗？”p@Temani：虽然不是什么错误，但有一个简短的“等等，什么…”时刻DI添加了一个css reset（），我设置了*{border:none；}，但是边框保持不变。