每次我在hr元素上添加“border：0”时，我的许多hr元素都会完全停止显示

Question

基本上我使用一系列hr元素来分割我的网页。这就是我的CSS在下面的样子：

hr{
    content: " ";
    display: block;
    height: .1px;
    width: 95%;
    margin:15px;
    background-color: #dfdfdf;
    border:0;
}

奇怪的是，每次添加'border'时，都会导致超过一半的元素完全停止在页面上显示。这可能是什么问题？我该如何解决这个问题？

P.S。如果我也使用“border-width：0px”，也会发生同样的事情。

Answer 1

问题肯定来自height: .1px;如果你删除边框，元素的大小将低于半个像素！由于像素不能被切割成碎片，因此浏览器往往不会显示它，或者显示完整的像素。取决于...不完全确定是什么。