Solved Add right vertical divider at end of top nav menu?

Hi,

I thought this would be simple, but turns out it isn't.

I have a horizontal top nav WordPress menu in Divi and at the end of it floating right is the search magnifying glass. Screenshot attached. What I'm trying to do is add a vertical bar 1px wide that extends higher than the height of each word in the menu and is between the last menu item ("Careers") and the magnifying glass. So it's supposed to divide the menu visually from the search icon.

Per the screenshot, I added an :after pseudo class just as a test on the menu items that didn't seem to work at all. This put the dividers underneath the menu items per the screenshot. Also the height isn't as tall as I'd like.

Can this be done?

 

Thanks a lot, I have it positioned with one issue:

I'm noticing that the Divi top nav height changes when you scroll down the page. At the top of the page, I have it aligned ok, then when I scroll down the nav height decreases in an animated effect and the position of the vertical bar gets misaligned and moves up.

Two screenshots attached.

Anything I can do to correct?

 

Thanks very much, you saved my day.