I have a nav containing a list of links. The list has a line-height: 1em. However the links have a height greater than 1em and overlap the
nav
line-height: 1em
1em
Just add display: inline-block to your a elements.
display: inline-block
a
Anchor tags are naturally inlined by user agent stylesheets which is what's causing your overflow.