I run into this a lot and see people who have had the same problem. When you make a set of navigation links out of an li
you set them to display: inline-block
and now there are extra spaces between your items.
The spaces are actual text spaces as interpreted by the browser.
To fix:
Set your container (ul
) to font-size:0
and if you have text in your li
, set its font-size
explicitly to what you want.
This will fix any extra spaces in your inline-block lists.