<ul>
  <li class="nav-item">
    <a class="nav-link active" id="home-tab" data-toggle="tab" href="#home" role="tab" aria-controls="home" aria-selected="true">
      Title
      <p>Request ID: 12345</p>
      <p>Locations: abc</p>
    </a>
  </li>
</ul>
ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.nav-link {
  position: relative;
  display: table;
  position: relative;
  background: red;
  text-decoration: none;
}
.nav-link.active:before {
  position: absolute;
  content: "";
  top: 50%;
  right: -10px;
  width: 0;
  height: 0;
  border-top: 7px solid transparent;
  border-bottom: 7px solid transparent;
  border-left: 7px solid #007bff;
  transform: translateY(-50%);
}
Run Pen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.