在 Android 设备浏览器中具有一些额外像素值的复选框答案

【问题标题】：Checkbox having some extra pixel value in Android device browser在 Android 设备浏览器中具有一些额外像素值的复选框
【发布时间】：2024-04-16 09:10:02
【问题描述】：

我已经通过应用一些 css 自定义了 html 复选框。在我使用的复选框边框是 1px 实心。但是在边框的左侧和顶部，复选框的像素量大于复选框的右侧和底部。在检查设备中的元素时，它显示边框 1px 实心值只要。

如何解决这个问题？

编辑 1：用于复选框的 CSS：

   .rootel {
      height: 12px;
      width: 12px;
      float: left;
      border: 1px solid #333333;
    }
    .rootel .innerel.active{
       background-position: 0 -4px;
       background-repeat: no-repeat;
       float: left;
       height: 20px;
       left: -3px;
       position: absolute;
       top: -5px;
       width: 22px;
     }

【问题讨论】：

您是否尝试过重置所有其他可能导致这种情况发生的属性？比如outline、box-shadow、……
是的。我已将大纲、-webkit-appearenace 和 -webkit-box-shadow 设置为无。但问题仍然存在。
由于 Android 4 box-shadow 没有前缀。你也重置了box-shadow？
我已将 css 值粘贴到我的问题中。

标签： html css android-browser

【解决方案1】：

我不知道你有什么问题，因为你没有放任何代码，所以我尝试了我自己

有趣的是我没有发现任何问题

Checkout here

如果我想对元素应用边框，后面应用了额外的 div，我已经定位为绝对，请注意，这可以通过 z-index 存档，只有其他明智的复选框不可点击

我认为可能有 0.03 个像素的边距

在桌面浏览器中似乎还可以，但在 android 浏览器中无法解决

【讨论】：

我已将 css 粘贴到我的问题中。请检查并提出解决问题的建议。
请看看这个。 jsbin.com/AxadoDI/1。在课堂上活跃。复选框图像放置在框内。
那里似乎没有问题
在桌面浏览器中，完全没有问题。该问题仅存在于 android 设备浏览器中。 *.com/questions/13415412/…。 *.com/questions/18146195/…。这些链接的处理方式相同，但未解决任何问题。
那么，这是安卓浏览器的问题吗？