chrome: css:transform:scale时部分缩放比例相邻图片间有间隔缝隙(chrome 106.0.5249.119)

一，问题的表现:

页面上左右两个div,里面各有一张图片,图片是相邻的，在页面上应该象一张图一样显示，

代码如下:

<!-- background: #000000; -->
<div style="100%;height:100%;" onclick="disp_header_footer()">
<!--左侧div-->
<div style="50%;height:100%;float:left;position: relative;">
{$rowleft.page_content}
</div>
<!--右侧div-->
<div style="50%;height:100%;float:left;position: relative;">
{$rowright.page_content}
</div>
</div>

父div做transform:scale时，正常情况各浏览器均无问题，但chrome出现部分缩放比例在两张图片间出现缝隙,
scale时:safari无问题，firefox无问题，如图:

 左右两侧的图片是紧密连接的，看不到中间有间隔

chrome在某个比例下如下图:可以看到有一条白线，是因为背景色是白色

但chrome并非总出现，比例是 0.6、0.65、0.625时正常,
如果类似0.566598这种较长的数字时会出现上述问题。 

说明：刘宏缔的架构森林是一个专注架构的博客，地址：https://www.cnblogs.com/architectforest

         对应的源码可以访问这里获取： https://github.com/liuhongdi/
         或: https://gitee.com/liuhongdi

说明：作者:刘宏缔 邮箱: 371125307@qq.com

二，临时的解决办法:

让右侧的div向左移0.3个像素:

代码:

<!-- background: #000000; -->
<div style="100%;height:100%;" onclick="disp_header_footer()">
<!--左侧div-->
<div style="50%;height:100%;float:left;position: relative;">
{$rowleft.page_content}
</div>
<!--右侧div-->
<div style="50%;height:100%;float:left;margin-left:-0.3px;position: relative;">
{$rowright.page_content}
</div>
</div>

效果：能正常显示了,如图:

说明：这个解决办法不够好，如果大家有更好的处理办法可以在评论时说一下

三，查看chrome的版本: