Padding being ignored by UL element

Question

I'm having some real trouble with CSS here... it's very odd.

I have a UL element wrapped within a Nav tag. I'm trying to apply some padding to the individual links and for some reason the padding isn't moving the element down and expanding the container as a result.

Here's a screenshot of what's happening:

As you can see, the padding is being noticed by the browser, but it's just overlapping with the element above (which is being floated). I can't find a way to push it down, or at the very least make the container expand to hold it properly.

For reference, I'm using the Skeleton responsive boilerplate as a base.

Here's a link to it live: http://richardsonweb.co.uk/

Answer 1

Try display:inline-block; on your li elements