html - Logo in center of nav -

I am trying to create an NAV with the logo in the center using the foundation.

Such:

  Home | About | [LOGO] | Services |  

This is my

I want to keep all NAV items and logos aside under the NAV tag. I pull push / class to align it. The problem is, though it is in the same line in the code, is not it working? Why?

I will just make the logo a list item and hide it from the screen reader:

  & lt; Li class = "small -2 column" aria-hidden = "true" & gt; & Lt; Img src = "http://design.ubuntu.com/wp-content/uploads/ubuntu-logo32.png" /> & Lt; / Li & gt;          
 = "Small -short column "& gt; & Lt; A href = "/" & gt; & Lt; Img src = "http://design.ubuntu.com/wp-content/uploads/ubuntu-logo32.png" /> & Lt; / A & gt; & Lt; / Li & gt;