html - :last-child effects all img tags

Question

这是第一次发布问题，所以我希望我做对了。我想要做的是让我的最后一个 child 在我的包装 div 中不向右留白。

.wrapper img,
video {
  width: 18%;
  margin-right: 2.5%;
}

.wrapper img,
video:last-child {
  margin-right: 0;
}

<div class="wrapper">
  <img src="cat.jpg">
  <video>
    <source src="cats.mp4">
    </video>
  <img src="morecats.jpg">
  <video>
    <source src="meow.mp4">
    </video>
  <img src="garfield.jpg">
</div>

这里的问题是，div 中的每个 img 标签现在都有 margin-right:0; .我希望有人理解我的问题并能帮助我。

注意:我不允许使用 HTML 和 CSS 以外的语言。

Answer 1

您还需要将 :last-child 添加到 img。

.wrapper img:last-child, .wrapper video:last-child{
    margin-right:0;
}