CSS - Border stretched to whole height of navbar - html

Question

I am trying to make a border on the right of most of my LIs (that are also anchor tags) fill the entirety of the div vertically, with a width of 1em like this (my figma mockup):
However, all I am getting currently is this:
Here is my (S)CSS:
.navbar-main {
margin-top: 2em;
display: flex;
background-color: hsl(206, 97%, 13%);
color: hsl(0, 0%, 100%);
border-radius: 34px;
width: 90vw;
height: 3em;
margin-left: auto;
margin-right: auto;
justify-content: space-between;
text-align: center;
.links {
display: flex;
justify-content: flex-start;
margin-left: 2em;
align-items: center;
}
ul {
display: inherit;
flex-direction: row;
align-items: center;
flex-wrap: wrap;
gap: 1em;
height: 100%;
}
/* Add a vertical border to the right of all of the lis that stretches to the whole of the div vertically */
li {
border-right: 1px solid hsl(0, 0%, 100%);
}
.langselect {
margin-right: 2em;
display: inherit;
justify-content: flex-end;
align-items: center;
}
.icon {
margin-right: 0.5em;
height: 1em;
width: 1em;
font-size: inherit;
text-align: center;
display: inline-block;
vertical-align: middle;
}
}
And here is my HTML (REACT):
<div className="navbar-main">
<div className="links">
<ul> {/*TODO: Remember to put icons before the a tags! (USE BOOTSTRAP ICONS!) */}
<li>
<a href="#">
<FaHome className="home icon"/>
Portfolio/CV
</a>
</li>
<li>
<a href="#">
<FaBookOpen className="book icon"/>
Portfolio/CV
</a>
</li>
<li>
<a href="#">
<FaPuzzlePiece className="puzzle icon"/>
!?#!#*$%
</a>
</li>
</ul>
</div>
<div className="langselect">
<FaGlobe className="world icon"/>
<p>Language Select</p>
</div>
</div>
All help is appreciated, thanks a lot.

Answer 1

Turns out after a bit of back and forth debugging and writing code, I found out that I could do this:
li {
display: inherit;
height: 100%;
border-right: 1px solid hsl(206, 94%, 20%);
padding-right: 1em;
a {
margin-top: auto;
margin-bottom: auto;
}
}
li:last-child {
border-right: none;
padding-right: 0;
}
This works flawlessly too, as seen here:
Thanks anyway for your guys' help!