<div class="navbar">
  <div class="navbar__container">
    <div class="navbar__main">
      <ul>
        <li>111</li>
        <li>222</li>
        <li>333</li>
      </ul>
    </div>
  </div>
</div>

$main-color: lime;
$second-color: green;

.navbar {
  background: linear-gradient(to right, $main-color 50%, $second-color 50%);
  &__container {
    max-width: 600px;
    background: $main-color;
    margin: auto;
    outline: 3px dotted red;
    outline-offset: -3px;
  }
  &__main{
    display: flex;
    justify-content: flex-end;
    max-width: 600px;
    margin: auto;
    background: $main-color;
  }
  
  ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    font-size: 30px;
    li {
      padding: 10px;
      border-left: 1px solid $second-color;
      &:last-child {
        background: $second-color;
      }
    }
  }
}