Bootstrap 4 - 如何制作覆盖DIV整个边的边框

Question

问题：使用Bootstrap 4.我试图在覆盖整个侧面的SECOND DIV（col-md-1）上制作一个左侧边框。现在它在上侧和下侧留下填充物。我愿意为这个例子切换到普通的Flexbox。

https://snag.gy/n92K8D.jpg

代码：

<div class="d-flex m-auto row no-padding opinion-list boxx-shadow bg-primary">
<div class="col-md-11">
  <ul class="list-inline m-auto">
    <li class="list-inline-item"><a class="nav-link active" href="#">Today</a></li>
   <li class="list-inline-item"><a class="nav-link" href="#">Columnists</a></li>
   <li class="list-inline-item"><a class="nav-link" href="#">Editorial</a></li>
  </ul>
 </div>
 <div class="col-md-1 bg-info no-padding" style="border-left: solid 1px silver;"><i class="fa fa-cog" aria-hidden="true"></i></div>
</div>

任何提示？