Question

这让我疯了。我可能会忽略一些超级简单的东西，因为我通常不会遇到类似psuedo类的问题。

我正在尝试删除最后一个子元素的div元素上的右边框。我可以让它在最后一个元素上使用类，但我不需要这样做（因为内容将在ee循环中）。

这是代码。所有内容都包含在一个ID为#sigature的部分中。嵌套在bootstrap列中的所有内容都包含在#feature-wrapper中。

<section id="small-featured">
  <div class="container">
    <div class="row">
      <div class="col-md-3">
        <div class="featured-wrapper">
          <a href="#"><img src="assets/img/36-6022.png" alt=""></a>
          <p>The Product Title</p>
        </div>
      </div>
      <div class="col-md-3">
        <div class="featured-wrapper">
          <a href="#"><img src="assets/img/36-5100.jpg" alt=""></a>
          <p>The Product Title</p>
        </div>
      </div>
      <div class="col-md-3">
        <div class="featured-wrapper">
          <a href="#"><img src="assets/img/46-455.jpg" alt=""></a>
          <p>The Product Title</p>
        </div>
      </div>
      <div class="col-md-3">
        <div class="featured-wrapper">
          <a href="#"><img src="assets/img/unisaw.jpg" alt=""></a>
          <p>The Product Title</p>
        </div>
      </div>
    </div>
  </div>
</section>

这是CSS

#small-featured {
  text-align: center;
}

#small-featured img {
  width: 250px;
  padding: 0 15px;
}

.featured-wrapper {
   border-right: 1px solid #eee;
}

#small-featured .featured-wrapper:last-child {
   border-right: none;
}

当我添加最后一点CSS时，所有边框都消失了。我尝试过只针对.featured-wrapper：last-child。

有什么想法吗？

Answer 1

#small-featured .col-md-3:last-child .featured-wrapper {
  border-right: none;
}

（所有.featured-wrapper都是:last-child。）¯\ _（ツ）_ /¯

删除border-right on：last-child psuedo-class

1 个答案: