Unwanted gap between elements in an inline block

Question

I have a menu implemented as a <ul> with elements in an inline block. I'm at my wits end trying to figure out why there's a gap between the elements, which causes the text to be offset to one side with respect to the borders separating them.

The right margin = right padding, and I've inspected the elements, and they look right:

There's also no space before the first character of the next element:

But clearly, from the first image, we see that the margin ends before the beginning of the first character of the next element. What can be causing that?

I've inspected all the properties in the CSS inspector, and find nothing else that it's inheriting.

Answer 1

Turns out the reason is because of (implicit) spaces between </li> and <li>.

Followed one of the suggestions here and that did the trick.