即使使用reset.css，也无法删除div之间的额外边距/填充

Question

在过去的1.5小时里，我一直在尝试我所知道的一切，并且无法想象这一点。 实际上我可以说，边距和填充是为0，但是，包含的div到目前为止，莫名其妙地比包含图像宽4px和1px。我不知道它来自哪里。

可能导致此事的几件事：

1. 我通过javascript将图像的最大宽度和最大高度设置为窗口的大小。
2. 我正在使用table，table-cell和inline-blocks的组合来按照我需要的方式设置排版。
3. 还使用100％宽度和高度的body和html
4. 这是Tumblr主题定制（虽然从头开始）

代码方面，很难将整个批次放在这里，所以现在，我只是给出链接。

希望如果能够解决这个问题，我将能够在这个问题中发布问题代码，以便将来参考。

链接：http://syndex.me

由于

Answer 1

你的意思是这个人？

.post.photo {
  display: inline-block;
  position: relative;
  height: 100%;
}

你可能不会看保证金，你正在看文字空白。由于div被定位为内联块，因此它就像一个内联元素，比如一个单词或<strong>标签。如果删除开始/结束<div>标记之间的空格，您的“边距”将会神奇地消失。

如果您使用内嵌块进行定位，line-height: 0和font-size: 0是您最好的朋友;他们关闭任何有效的空白，虽然他们是非常丑陋的黑客。在大多数情况下，浮子是更好的解决方案。

请参阅The Fashion Spot上的#column_content和#column右侧以查看正在使用的内联块列。

Answer 2

div之间有空格，因为您使用display: inline-block并且div用空格分隔。就像你要在不同的行上写字母一样：它们之间会出现一个空格。由于相同的原因，发生垂直空白区域 - 图像显示为内联，浏览器为线高保留一些空间。解决方案是对div使用display: block和float: left，为图像使用display: block。

Answer 3

在这种情况下，我无法使用float：left，因为似乎没有可靠的方法来实现使用它的中心对齐系列div。答案非常简单，内联阻塞，中心对齐的包装器/子序列中的任何标记都需要在它们之间没有空白区域，并且应该包含在一个连续的代码行中。相当愚蠢，但它适用于这种情况100％。