Chrome中表格单元格内图像侧面的额外边距答案

【问题标题】：Extra margin on side of an image inside table-cell in ChromeChrome中表格单元格内图像侧面的额外边距
【发布时间】：2023-04-01 18:48:01
【问题描述】：

<div id='wrapper'>
  <div id='innerWrapper'>
     <img src ='image.png'" />
  </div>
</div>

#wrapper{
  display: table;
  border-spacing:0;
}

#innerWrapper {
  display:table-cell;
  padding:0;
  margin:0;
  border:0;
}
img {
   padding:0;
   margin:0;
   border:0;
}

在 Chrome 中，这会在图像右侧呈现 1px 的边距并将 innerWrapper div 推出。如何去除边距？ CSS 重置没有帮助

【问题讨论】：

你能做一个小提琴吗？
发布的代码，在 Chrome 24beta 上测试时，完全没有体现出文中描述的问题-

标签： html google-chrome css webkit

【解决方案1】：

你试过了吗

<div id='innerWrapper'><img src ='image.png'" /></div>

源码中没有换行符？

【讨论】：

这可能会有所帮助，因为换行符在 html 中被解释为空格

【解决方案2】：

重置页面上所有 DIV 的边距：

div { 
    margin:0;
    padding:0;
}

【讨论】：