Looks like the class names are different, and open and close quotes are missing 
for class and id attributes


Greg
-----Original Message-----
From: css-d-boun...@lists.css-discuss.org 
[mailto:css-d-boun...@lists.css-discuss.org] On Behalf Of Chris Kavinsky
Sent: Friday, November 04, 2016 11:59 AM
To: css-d@lists.css-discuss.org
Subject: [css-d] help with responsive navigation

I'm reworking a client site navigation to work better responsively and using a 
previous site as a model. I think I have the page code and css code correct, 
but I'm not getting the correct results. In short, the menu is collapsing when 
the screen is smaller but the link isn't toggling the menu, and I can't figure 
out why. Here are links:

the site I'm working on:
http://ipegstl.com/commercial/

the site I'm trying to mimic:
http://otpnet.com/

here's the css code that works the button link for the toggling:

/*Style 'show menu' label button and hide it by default*/ .show-menu {
    font-family: 'gandhi_sansbold';
    text-decoration: none;
    color: #fff;
    background:#af292e;
    text-align: center;
    padding: 10px 0;
    display: none;
}

/*Hide checkbox*/
input[type=checkbox]{
    display: none;
    -webkit-appearance: none;
}

/*Show menu when invisible checkbox is checked*/ input[type=checkbox]:checked ~ 
.menu-menu-1-container #menu-menu-1 {
    display: block;
}

@media only screen and (max-width : 1000px) {

/*Make dropdown links appear inline*/
#site-navigation ul {
        position: static;
        display: none;
    }
    /*Create vertical spacing*/
#site-navigation li {
        margin-bottom: 1px;
    }

    /*Make all menu links full width*/
#site-navigation ul li {
        width: 100%;
    }

#site-navigation li a {
    width: 100%;
    background:#af292e;
    }

    /*Display 'show menu' link*/
.show-menu {
        display:block;
    }
}



What am I overlooking?
______________________________________________________________________
css-discuss [css-d@lists.css-discuss.org] 
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- 
http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
______________________________________________________________________
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to