Responsive Menu not Working on Resize

Submitted by ajax201222 on Tue, 2017-02-21 22:45

I'm trying to make 2 items on my nav menu hide when the sections are hidden. Right now, I'm using jQuery to move and hide each section and media queries to hide and display the nave menu items. This is the related nav section in my HTML:

<ul class="main-nav">
   <li><a href="#about">About</a></li>
   <li class="music-link"><a href="#music">Music</a></li>
   <li><a href="#tour">Tour</a></li>
   <li><a href="#epk">EPK</a></li>
   <li class="photos-link"><a href="#photos">Photos</a></li>
   <li><a href="#contact">Contact</a></li>
</ul>

This is my media query:

I have three columns 1 2 and 3 counted from left. When reduce viewport I want the 3 to be below the 1 and this to be under 2

Submitted by Tojo on Sun, 2014-11-09 22:42

Here I have listed the html file and at the bottom the css file.
When I view this html file it display three columns.
The first one is far to the left is called menu and then the second is called left column which is in the middle and then finally the one to the right is called Right column.

If I now reduce the width of the screen it will display the menu at the top and then below the menu it will desplay the left column the then below the left column it will display the right column. Now it is displayed like this
Menu
Left column
Right column

media queries fail on iPhone 5

Submitted by pzbrawl on Sat, 2014-08-09 19:46

In Google Chrome emulating an iPhone5, the test page shown below works as expected: width:568 and height:320 are detected by direct media query, by Javascript media query, and by direct javascript.

On a real iPhone5, though, the direct media queries and Javascript media queries fail, even though Javascript correctly detects screen width & height. What am I missing?

<html>
<head>
  <meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0" />
  <style>
  @media screen and (device-height:320px)  and (device-width:568px) {
    .deviceID:after {

Syndicate content