html - 一个像素在 Firefox 和 chrome 中有所不同

Question

我试了很多方法都解决不了，chrome 和 firefox 有一个像素不一样

.lside,.rside{
 position: absolute;
 top:22.8rem;
 width: 60px;
 padding: 0;
 margin: 0;
 }

.lside{
 background: url(../img/sideL.png) no-repeat;
 height: 120px;
 left: -20px;
 }

.rside{
 background: url(../img/sideR.png) no-repeat;
 height: 120px;
 right: -60px;
 }

在 Firefox 和 chrome 中有一个像素不同

Answer 1

网页在不同浏览器中的呈现方式总是不同的。所以这个位置在不同的浏览器中可能会有所不同。我不知道有什么解决办法来解决它。我无法对您的帖子发表评论，因为我没有太多声誉。这就是为什么我将其发布为答案。您可以尝试 firefox css hack 来解决这个问题，但我不确定它是否能解决您的问题。

@-moz-document url-prefix() { 

  } 

将您的代码放入此代码段并尝试或尝试 css reset 并检查您是否将其包含在您的 html 文件中

<meta name="viewport" width="device-width">