背景图片不显示内部div

Question

我有一个导航窗口，其中包含徽标，然后是不同的导航链接。我想在导航的底部有一个边框，我使用了背景图片。我不想在整个导航中只在内部div之外。

下面的第一张图片当前显示的方式

，第二个是期望的结果

主要问题是内部div的一些底部边框是渐变的透明，但父级的底部边框接管它并删除透明。

是否存在内部div不显示背景的方法？或者父div的底部边框只显示在内部div之外？

我的道歉，这是我目前的设置

.parentNav {
  background-image: url(blue_line_bottom);
  background-repeat: no-repeat;
  background-size: 100% 7%;
  background-position-y: 82px;
}
.logoImage {
  width: 100%;
  height: 89px;
  right: 0;
  position: relative;
  background-image: url(http://sitelogo_with_transparency);
  background-repeat: no-repeat;
  background-position: -17px 1px;
}
.navLanding {
  padding-top: 4px;
}
.item {
  display: inline-block;
  width: 25%;
  text-align: center;
  border-bottom: 3px solid #006B93;
}

<div class="parentNav">
  <div class="siteLogo">
    <div class="logoImage">
      <a href="/" src="http://sitelogo_with_transparency"></a>
    </div>
  </div>
  <div class="navLanding">
    <div class="item">
      <a href="">First Page</a>
    </div>
    <div class="item">
      <a href="/second">Second Page</a>
    </div>
    <div class="item">
      <a href="/third">Third Page</a>
    </div>
    <div class="item">
      <a href="/fourth">Fourth Page</a>
    </div>
    <div class="item">
      <a href="/fifth">Fifth Page</a>
    </div>
  </div>
</div>