Menu Items not getting displayed when making nav visible through css media queries

Question

I am having horizontal menu bar which I don't want to display for screens having width < 610 px. For that I am setting my nav tag as :

nav{display:none;}

Now, I am writing my media query as :

@media screen and (min-width:610px){nav{display:block;}}

When I am checking for screen size>610px , I am getting only blank menu bar without any menu list item.By the way, I am also using z-index:2 for my <ul> tag.

Answer 1

Use the following, note the changes I made.

jsFiddle here

@media screen and (max-width:610px){
    nav{
        display:none;
    }
}