为什么这个CSS类不适用于这个div？

Question

我有一个带有“flag”类的div，里面有一张图片。 div嵌套在另一个名为“top”的div中。 “top”包含其中的许多其他div。由于某种原因，下面列出的“flag”CSS类没有应用于具有相同类的“flag”div。为什么呢？

.flag img {
  width: 1px;
  height: 1px;
  margin: auto;
}

<div name="top">
  <div class="blog-title">
    <a href="https://prop11-2.tumblr.com/"> Vote Yes On Proposition 11.2 </a>
  </div>
  <div class="flag">
    <img src="https://ak3.picdn.net/shutterstock/videos/2565830/thumb/1.jpg"> </img>
  </div>
  <div id="description" class="container">
    <h1> Proposition 11.2 is an amendment to the already in place law that allows the humane execution of inmates via what our scientists are calling "Orbital Execution".
    </h1>
  </div>
</div>

这会导致上面div中的图片为1px xpp，但由于某种原因它无法正常工作。对于我的生活，我无法理解为什么。我错过了什么标点符号？

编辑：由于某种原因，我创建了一个名为“flag2”的新CSS类，这似乎可以解决问题。我仍然不知道出了什么问题，我所做的就是复制并粘贴“flag”类，将其重命名为“flag2”并更改div类的目标。

Answer 1

图像显示：默认为内联，因此设置宽度，高度和边距：自动将无法像预期的那样工作。尝试在IMG标签上设置display：block。这应该够了吧。

Answer 2

它确实有效，但你的风格只有1像素，很难看到，尝试增加几个像素

.flag img{
  width: 100px;
  height: 100px;
  margin: auto;
}