media screen working, but page breaks on a certain screen size

Hi, on this page: http://dev2.magickitchen.com/index.html

thanks to the help of one of your members, I have a media screen query.  It takes down the height of the nav bar, but only on large screens.  When I use a mobile emulator to test on different screens, the page goes awry when I get to the iPad mini.
http://mobiletest.me/ipad_mini_emulator/#u=http://dev2.magickitchen.com/index.html

You see how there's the top nav, then a lot of orange space with a vertical nav in the middle of it? It's supposed to look more like: http://mobiletest.me/google_nexus_7_emulator/#u=http://dev2.magickitchen.com/index.html

What is causing this, and can I add another media query to quell it? Thanks very much.
Melody ScottAsked:
Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

x
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Tom BeckCommented:
Try this. Change the height in the media query to min-height:
@media screen and (min-width: 768px) {
.navscreenonly {
    font-size: 12px;
    line-height: 40px;
    min-height: 40px;
}
}

Open in new window

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Melody ScottAuthor Commented:
Thanks, I'll try it!
Melody ScottAuthor Commented:
No, sadly that did not work- now it's broken on the big screen in the same way: http://dev2.magickitchen.com/
Determine the Perfect Price for Your IT Services

Do you wonder if your IT business is truly profitable or if you should raise your prices? Learn how to calculate your overhead burden with our free interactive tool and use it to determine the right price for your IT services. Download your free eBook now!

Melody ScottAuthor Commented:
Wait, no it isn't. That's strange, it was and then wasn't... not sure what happened there. But on the ipad, it is still not right.
Melody ScottAuthor Commented:
Please forget everything I just said. It works perfectly everywhere. Maybe my brain is broken. :( Thanks!
Melody ScottAuthor Commented:
Thanks!
Tom BeckCommented:
Probably just a browser cache issue. Thanks for the points.
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
CSS

From novice to tech pro — start learning today.