CSS/HTML网格有一个神秘的缺口

我有一个网格的文章项目，这是工作在过去，但现在有一些“差距”的布局。网格中的所有项都使用相同的CSS，所以我不明白为什么会有这些间隙。我把它放在了JSFIDLE中：原始页面在WordPress中，但我不认为这是问题的根源

以下是CSS的相关部分：

.featured-grid {
  float: left;
  min-height: 425px;
  margin: 1em .5em 0 0;
  width: 31%; }

.featured-title-grid h4 {
  font-size: 18px; }

 .featured-author-grid {
  float: left; }

.featured-date-grid {
  float: right;
  margin: 0 0 1em 0;
  font-size: 15px; }


.featured-image-grid {
 clear: left;
 height: 200px;
  width: 100%;
  margin: 1em 0 0;
  padding: 1em 0 1em; }

.featured-date-feed {
  clear: left;
  margin: 1em 0 0; }

.featured-news-feed {
  background: #efefef;
  float: left;
  margin: .5em 2em 2em 0;
 padding: .5em; }

---

你能澄清你看到的差距吗？在Firefox上的JSFIDLE演示中，我没有看到任何难看的东西。我看到（在Firefox中也是如此）在第二行中，第一列中没有任何内容，在第三行中，第一列或第二列中没有任何内容。只是需要通过太多的代码来隔离问题。如果您可以提供最小的标记来配合您在问题中发布的CSS，那么您的问题可能会更快地得到解决。此外，仅使用您提供的CSS不会再现错误，因此您需要添加更多的CSS。基本上，问题似乎是您有一个最小高度，但没有为

声明高度。特色网格
。为您的
h4
项目标题和
项目容器设置一个固定高度。特色网格
项目容器应该更容易排列。TylerH，您真是个好朋友。非常感谢您的耐心和工作。显然，我还不熟悉如何将代码示例放在JSFIDLE中让其他人看到，所以在这一轮中我学到了很多。问题解决了！