从空元素中移除边距

Question

我在这个图片上的div上遇到了许多消除边距的问题。我正在循环生成许多divs，但其中一些是空的，尽管高度为0的元素仍然应用了边距。如何使用CSS消除空元素上的边距？

注意：不幸的是，当生成divs时，我不知道哪些瓷砖是空的。只有子节点有条件，因此它们可以生成具有空子节点的节点，从而使我得到具有边距的空div。

.tile {
float: left;
width: 24%;
display: inline-block;
vertical-align: top;
margin: 10px 0.25%;}

- Diogo123

---

尝试、喜欢、display: none。这通常能解决问题。 - yaakov

Answer 1

尝试这个：

.tile:empty{
  margin:0;
}

.tile, .tile1 {
  float: left;
  width: 24%;
  display: inline-block;
  vertical-align: top;
  margin: 10px 0.25%;
  background-color: red;
}

.tile:empty{
  margin:0;
}

<h1>With Empty Selector</h1>
<div class="tile">Not Empty</div>
<div class="tile"></div>
<div class="tile">Not Empty</div>
<br><br>
<h1>Without Empty Selector</h1>
<div class="tile1">Not empty</div>
<div class="tile1"></div>
<div class="tile1">Not Empty</div>

- Ehsan

---

很遗憾，当div生成时，我不知道哪些瓷砖是空的。只有子元素有条件可以生成，然后子元素为空，最终导致我得到一个空的div。 - Diogo123

不好意思，我有10个divs。其中一些是空的，一些则有内容。我想要去除空白divs的边距。它们的高度等于0但仍应用了外边距。有没有方法可以去掉它？ - Diogo123

@Diogo123，当你使用CSS样式时，它会自动检测空的div。 - Ehsan

你看过我的帖子了吗？ - Ehsan

它没有起作用。所有的div里面都有一些ng-if注释。 - Diogo123

Answer 2

当您生成时，请检查它是否具有值，如果没有值，则不要生成该div。

- Tran Audi

---

我做不到那样。只有孩子们有条件。 - Diogo123