How do I make evenly spaced flex content with left-aligned text that may extend the height?

Question

I have been slamming my head into this one for awhile and I think I actually might have run into something that isn't possible.

I have a navigation menu that has some extreme differences in length of content. I want to space that content perfectly even no matter where the line break occurs, depending upon the width of the parent container. I'm using flexbox for this, but I can't seem to get exactly what I'm looking for.

Here is my markup:

.nav-holder {
  width: 500px;
  border:1px solid blue;
  padding: 1px;
}
.nav{
  display: flex;
  flex-wrap: nowrap;
  justify-content:space-between;
  width: 100%;
}
.nav-item {
  border: 1px solid red;
}

<div class="nav-holder">
  <div class="nav">
    <div class="nav-item">Home</div>
    <div class="nav-item">Manufacturing Services</div>
    <div class="nav-item">Specialized Manufacturing Services</div>
    <div class="nav-item">Media &amp; News</div>
    <div class="nav-item">Contact</div>
  </div>
</div>

Here is what is happening:

Here is what I would like to happen:

I achieved that by manually setting the width of the two long items to exact pixels. That is not acceptable considering that the content may change.

I essentially want the div to get the EXACT width of actual content if it is too long and has to break to the next line instead of filling out the rest of that space with nothing.