当前位置:  开发笔记 > 前端 > 正文

由于像素舍入误差,每个<div>与flexbox之间的像素间隙较大

如何解决《由于像素舍入误差,每个<div>与flexbox之间的像素间隙较大》经验,为你挑选了1个好方法。

如何删除看似由像素的舍入分数中的错误引起的黑线?这似乎只是Chrome的问题,Firefox似乎正在进行更智能的舍入并完美呈现.

这个问题有一个简单的解决方案吗?

这就是Chrome呈现的方式:

Chrome bug

  .container {
    height: 100px;
    width: 100%;
    background-color: black;
    display: flex;
    flex-flow: nowrap column;
  }
  .row {
    background-color: lightgreen;
    flex: 1 1 auto;
  }



1> G-Cyr..:

你可以尝试使用box-shadow填充间隙(?)

.container {
    height: 100px;
    width: 100%;
    background-color: black;
    display: flex;
    flex-flow: nowrap column;
  }
  .row {
    background-color: lightgreen;
    flex: 1 1 auto;
    box-shadow:0 1px lightgreen;
  }
推荐阅读
放ch养奶牛
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有