JSFiddle - React, Tailwind, and code Playground

HTML

<div>
  <a href="#1">Item 1</a>
  <a href="#2">Item 22</a>
  <a href="#3">Item 333</a>
  <a href="#4">Item 4444</a>
  <a href="#5">Item 55555</a>
  <a href="#6">Item 666666</a>
  <a href="#7">Item 7777777</a>
</div>

CSS

a {
  position: relative;
  color: black;
  font-family: Arial;
  text-decoration: none;
  display: inline-block;
  vertical-align: top;
  padding: 10px 5px;
  margin-right: 10px;
}
a:after {
  position: absolute;
  content: '';
  top: 0px;
  right: -8px;
  height: 100%;
  border-right: 1px solid blue;
}
a:last-of-type:after {
  display: none;
}