Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    Regular Coder
    Join Date
    Jan 2013
    Location
    Australia
    Posts
    118
    Thanks
    22
    Thanked 0 Times in 0 Posts

    Google Chrome Not Picking Up Changes

    Hello.

    When I do my responsive testing on 980 up on google chrome my responsive menu is still showing for some reason? works normal on on fire fox where #menu to back to default from 980 up seems strange

    Code:
    @media screen and (max-width: 1024px) {
    #container {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    }
      
    .nav {  
    display: none;
    }
    
    label.mobile_menu span {
    display: inline;
    }
    
    label.mobile_menu {
    position: relative;
    display: block;
    width: 100%;
    background: #51C1F1;
    padding: 10px 0;
    }
    
    #mobile_menu:checked+.nav {
    display: block;
    }
    
    label:after {
    position: absolute;
    top:0px;
    right: 10px;
    content: "\2261";
    font-size: 30px;
    color: white;
    }
    
    .nav {
    padding: 0;
    }
    
    .nav li {
    width: 100%;
    text-align: left;
    margin-left: 0;
    }
    
    .nav > li {
    border-right: none;
    padding: 18px 0px;
    position: relative;
    }
    
    .nav > li > a {
    display: inline;
    }
    
    .nav li ul  {
    top:45px;
    }
    
    .nav li ul {
    padding: 0;
    }
    
    .nav li > ul li {
    padding: 18px 0px;
    }
    
    .nav > li > ul {
    width: 100%;
    }
    
    .nav > li > ul li ul {
    width: 100%;
    top:43px;
    left: 0;
    margin-top: 30px;
    z-index:2;
    }
    
    .nav > li > ul > li:hover ul {
    margin-top: 0;
    }
    
    .nav > li > ul li ul li ul {
    width: 100%;
    top:43px;
    left: 0px;
    margin-left: 0;
    margin-top: 30px;
    }
    
    .nav > li > ul > li ul li:hover ul{
    margin-top: 0;
    }
    
    .nav > li > ul li{ 
    padding: 15px 0 15px 6%;
    width: 94%;
    }
    
    .nav > li > ul li ul li{ 
    padding: 15px 0 15px 9%;
    width: 91%;
    }
    
    .nav > li > ul li ul li ul li{ 
    padding: 15px 0 15px 12%;
    width: 88%;
    }
    
    .nav ul li.dropdown:after {
    left: 90%;
    }
    
    }
    
    @media screen and (max-width: 978px) {
    #container {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    }
      
    .nav {  
    display: none;
    }
    
    label.mobile_menu span {
    display: inline;
    }
    
    label.mobile_menu {
    position: relative;
    display: block;
    width: 100%;
    background: #51C1F1;
    padding: 10px 0;
    }
    
    #mobile_menu:checked+.nav {
    display: block;
    }
    
    label:after {
    position: absolute;
    top:0px;
    right: 10px;
    content: "\2261";
    font-size: 30px;
    color: white;
    }
    
    .nav {
    padding: 0;
    }
    
    .nav li {
    width: 100%;
    text-align: left;
    margin-left: 0;
    }
    
    .nav > li {
    border-right: none;
    padding: 18px 0px;
    position: relative;
    }
    
    .nav > li > a {
    display: inline;
    }
    
    .nav li ul  {
    top:45px;
    }
    
    .nav li ul {
    padding: 0;
    }
    
    .nav li > ul li {
    padding: 18px 0px;
    }
    
    .nav > li > ul {
    width: 100%;
    }
    
    .nav > li > ul li ul {
    width: 100%;
    top:43px;
    left: 0;
    margin-top: 30px;
    z-index:2;
    }
    
    .nav > li > ul > li:hover ul {
    margin-top: 0;
    }
    
    .nav > li > ul li ul li ul {
    width: 100%;
    top:43px;
    left: 0px;
    margin-left: 0;
    margin-top: 30px;
    }
    
    .nav > li > ul > li ul li:hover ul{
    margin-top: 0;
    }
    
    .nav > li > ul li{ 
    padding: 15px 0 15px 6%;
    width: 94%;
    }
    
    .nav > li > ul li ul li{ 
    padding: 15px 0 15px 9%;
    width: 91%;
    }
    
    .nav > li > ul li ul li ul li{ 
    padding: 15px 0 15px 12%;
    width: 88%;
    }
    
    .nav ul li.dropdown:after {
    left: 90%;
    }
    
    
    }
    
    @media screen and (max-width: 768px) {
    #container {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    }
      
    .nav {  
    display: none;
    }
    
    label.mobile_menu span {
    display: inline;
    }
    
    label.mobile_menu {
    position: relative;
    display: block;
    width: 100%;
    background: #51C1F1;
    padding: 10px 0;
    }
    
    #mobile_menu:checked+.nav {
    display: block;
    }
    
    label:after {
    position: absolute;
    top:0px;
    right: 10px;
    content: "\2261";
    font-size: 30px;
    color: white;
    }
    
    .nav {
    padding: 0;
    }
    
    .nav li {
    width: 100%;
    text-align: left;
    margin-left: 0;
    }
    
    .nav > li {
    border-right: none;
    padding: 18px 0px;
    position: relative;
    }
    
    .nav > li > a {
    display: inline;
    }
    
    .nav li ul  {
    top:45px;
    }
    
    .nav li ul {
    padding: 0;
    }
    
    .nav li > ul li {
    padding: 18px 0px;
    }
    
    .nav > li > ul {
    width: 100%;
    }
    
    .nav > li > ul li ul {
    width: 100%;
    top:43px;
    left: 0;
    margin-top: 30px;
    z-index:2;
    }
    
    .nav > li > ul > li:hover ul {
    margin-top: 0;
    }
    
    .nav > li > ul li ul li ul {
    width: 100%;
    top:43px;
    left: 0px;
    margin-left: 0;
    margin-top: 30px;
    }
    
    .nav > li > ul > li ul li:hover ul{
    margin-top: 0;
    }
    
    .nav > li > ul li{ 
    padding: 15px 0 15px 6%;
    width: 94%;
    }
    
    .nav > li > ul li ul li{ 
    padding: 15px 0 15px 9%;
    width: 91%;
    }
    
    .nav > li > ul li ul li ul li{ 
    padding: 15px 0 15px 12%;
    width: 88%;
    }
    
    .nav ul li.dropdown:after {
    left: 90%;
    }
    
    /************ Categories Menu *****************/
    
    #menu {  
    display: none;
    }
    
    label.mainmenu-mobile span {
    display: inline;
    }
    
    label.mainmenu-mobile {
    position: relative;
    display: block;
    width: 100%;
    background: #51C1F1;
    padding: 10px 0;
    }
    
    #mainmenu-mobile:checked+#menu {
    display: block;
    }
    
    label:after {
    position: absolute;
    top:0px;
    right: 10px;
    content: "\2261";
    font-size: 30px;
    color: white;
    }
    
    #menu {
    padding: 0;
    }
    
    #menu li {
    width: 100%;
    text-align: left;
    margin-left: 0;
    }
    
    #menu > li {
    border-right: none;
    padding: 18px 0px;
    position: relative;
    }
    
    #menu > li > a {
    display: inline;
    }
    
    #menu li ul  {
    top:45px;
    }
    
    #menu li ul {
    padding: 0;
    }
    
    #menu li > ul li {
    padding: 18px 0px;
    }
    
    #menu > li > ul {
    width: 100%;
    }
    
    #menu > li > ul li ul {
    width: 100%;
    top:43px;
    left: 0;
    margin-top: 30px;
    z-index:2;
    }
    
    #menu > li > ul > li:hover ul {
    margin-top: 0;
    }
    
    #menu > li > ul li ul li ul {
    width: 100%;
    top:43px;
    left: 0px;
    margin-left: 0;
    margin-top: 30px;
    }
    
    #menu > li > ul > li ul li:hover ul{
    margin-top: 0;
    }
    
    #menu > li > ul li{ 
    padding: 15px 0 15px 6%;
    width: 94%;
    }
    
    #menu > li > ul li ul li{ 
    padding: 15px 0 15px 9%;
    width: 91%;
    }
    
    #menu > li > ul li ul li ul li{ 
    padding: 15px 0 15px 12%;
    width: 88%;
    }
    
    #menu ul li.dropdown:after {
    left: 90%;
    }
    
    }
    
    @media screen and (max-width: 640px) {
    #container {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    }
      
    .nav {  
    display: none;
    }
    
    label.mobile_menu span {
    display: inline;
    }
    
    label.mobile_menu {
    position: relative;
    display: block;
    width: 100%;
    background: #51C1F1;
    padding: 10px 0;
    }
      
    #mobile_menu:checked+.nav {
    display: block;
    }
    
    label:after {
    position: absolute;
    top:0px;
    right: 10px;
    content: "\2261";
    font-size: 30px;
    color: white;
    }
    
    .nav {
    padding: 0;
    }
    
    .nav li {
    width: 100%;
    text-align: left;
    margin-left: 0;
    }
    
    .nav > li {
    border-right: none;
    padding: 18px 0px;
    position: relative;
    }
    
    .nav > li > a {
    display: inline;
    }
    
    .nav li ul  {
    top:45px;
    }
    
    .nav li ul {
    padding: 0;
    }
    
    .nav li > ul li {
    padding: 18px 0px;
    }
    
    .nav > li > ul {
    width: 100%;
    }
    
    .nav > li > ul li ul {
    width: 100%;
    top:43px;
    left: 0;
    margin-top: 30px;
    z-index:2;
    }
    
    .nav > li > ul > li:hover ul {
    margin-top: 0;
    }
    
    .nav > li > ul li ul li ul {
    width: 100%;
    top:43px;
    left: 0px;
    margin-left: 0;
    margin-top: 30px;
    }
    
    .nav > li > ul > li ul li:hover ul{
    margin-top: 0;
    }
    
    .nav > li > ul li{ 
    padding: 15px 0 15px 6%;
    width: 94%;
    }
    
    .nav > li > ul li ul li{ 
    padding: 15px 0 15px 9%;
    width: 91%;
    }
    
    .nav > li > ul li ul li ul li{ 
    padding: 15px 0 15px 12%;
    width: 88%;
    }
    
    .nav ul li.dropdown:after {
    left: 90%;
    }
    
    /************ Categories Menu *****************/
    
    #menu {  
    display: none;
    }
    
    label.mainmenu-mobile span {
    display: inline;
    }
    
    label.mainmenu-mobile {
    position: relative;
    display: block;
    width: 100%;
    background: #51C1F1;
    padding: 10px 0;
    }
    
    #mainmenu-mobile:checked+#menu {
    display: block;
    }
    
    label:after {
    position: absolute;
    top:0px;
    right: 10px;
    content: "\2261";
    font-size: 30px;
    color: white;
    }
    
    #menu {
    padding: 0;
    }
    
    #menu li {
    width: 100%;
    text-align: left;
    margin-left: 0;
    }
    
    #menu > li {
    border-right: none;
    padding: 18px 0px;
    position: relative;
    }
    
    #menu > li > a {
    display: inline;
    }
    
    #menu li ul  {
    top:45px;
    }
    
    #menu li ul {
    padding: 0;
    }
    
    #menu li > ul li {
    padding: 18px 0px;
    }
    
    #menu > li > ul {
    width: 100%;
    }
    
    #menu > li > ul li ul {
    width: 100%;
    top:43px;
    left: 0;
    margin-top: 30px;
    z-index:2;
    }
    
    #menu > li > ul > li:hover ul {
    margin-top: 0;
    }
    
    #menu > li > ul li ul li ul {
    width: 100%;
    top:43px;
    left: 0px;
    margin-left: 0;
    margin-top: 30px;
    }
    
    #menu > li > ul > li ul li:hover ul{
    margin-top: 0;
    }
    
    #menu > li > ul li{ 
    padding: 15px 0 15px 6%;
    width: 94%;
    }
    
    #menu > li > ul li ul li{ 
    padding: 15px 0 15px 9%;
    width: 91%;
    }
    
    #menu > li > ul li ul li ul li{ 
    padding: 15px 0 15px 12%;
    width: 88%;
    }
    
    #menu ul li.dropdown:after {
    left: 90%;
    }
    
    #footer .col {
    	float: none;
    }
    
    }
    
    @media screen (max-width: 480px) {
    #container {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    }
      
    .nav {  
    display: none;
    }
    
    label.mobile_menu span {
    display: inline;
    }
    
    label.mobile_menu {
    position: relative;
    display: block;
    width: 100%;
    background: #51C1F1;
    padding: 10px 0;
    }
    
    #mobile_menu:checked+.nav {
    display: block;
    }
    
    label:after {
    position: absolute;
    top:0px;
    right: 10px;
    content: "\2261";
    font-size: 30px;
    color: white;
    }
    
    .nav {
    padding: 0;
    }
    
    .nav li {
    width: 100%;
    text-align: left;
    margin-left: 0;
    }
    
    .nav > li {
    border-right: none;
    padding: 18px 0px;
    position: relative;
    }
    
    .nav > li > a {
    display: inline;
    }
    
    .nav li ul  {
    top:45px;
    }
    
    .nav li ul {
    padding: 0;
    }
    
    .nav li > ul li {
    padding: 18px 0px;
    }
    
    .nav > li > ul {
    width: 100%;
    }
    
    .nav > li > ul li ul {
    width: 100%;
    top:43px;
    left: 0;
    margin-top: 30px;
    z-index:2;
    }
    
    .nav > li > ul > li:hover ul {
    margin-top: 0;
    }
    
    .nav > li > ul li ul li ul {
    width: 100%;
    top:43px;
    left: 0px;
    margin-left: 0;
    margin-top: 30px;
    }
    
    .nav > li > ul > li ul li:hover ul{
    margin-top: 0;
    }
    
    .nav > li > ul li{ 
    padding: 15px 0 15px 6%;
    width: 94%;
    }
    
    .nav > li > ul li ul li{ 
    padding: 15px 0 15px 9%;
    width: 91%;
    }
    
    .nav > li > ul li ul li ul li{ 
    padding: 15px 0 15px 12%;
    width: 88%;
    }
    
    .nav ul li.dropdown:after {
    left: 90%;
    }
    
    /************ Categories Menu *****************/
    
    #menu {  
    display: none;
    }
    
    label.mainmenu-mobile span {
    display: inline;
    }
    
    label.mainmenu-mobile {
    position: relative;
    display: block;
    width: 100%;
    background: #51C1F1;
    padding: 10px 0;
    }
    
    #mainmenu-mobile:checked+#menu {
    display: block;
    }
    
    label:after {
    position: absolute;
    top:0px;
    right: 10px;
    content: "\2261";
    font-size: 30px;
    color: white;
    }
    
    #menu {
    padding: 0;
    }
    
    #menu li {
    width: 100%;
    text-align: left;
    margin-left: 0;
    }
    
    #menu > li {
    border-right: none;
    padding: 18px 0px;
    position: relative;
    }
    
    #menu > li > a {
    display: inline;
    }
    
    #menu li ul  {
    top:45px;
    }
    
    #menu li ul {
    padding: 0;
    }
    
    #menu li > ul li {
    padding: 18px 0px;
    }
    
    #menu > li > ul {
    width: 100%;
    }
    
    #menu > li > ul li ul {
    width: 100%;
    top:43px;
    left: 0;
    margin-top: 30px;
    z-index:2;
    }
    
    #menu > li > ul > li:hover ul {
    margin-top: 0;
    }
    
    #menu > li > ul li ul li ul {
    width: 100%;
    top:43px;
    left: 0px;
    margin-left: 0;
    margin-top: 30px;
    }
    
    #menu > li > ul > li ul li:hover ul{
    margin-top: 0;
    }
    
    #menu > li > ul li{ 
    padding: 15px 0 15px 6%;
    width: 94%;
    }
    
    #menu > li > ul li ul li{ 
    padding: 15px 0 15px 9%;
    width: 91%;
    }
    
    #menu > li > ul li ul li ul li{ 
    padding: 15px 0 15px 12%;
    width: 88%;
    }
    
    #menu ul li.dropdown:after {
    left: 90%;
    }
    
    #footer .col {
    	float: none;
    }
    
    }
    
    @media  screen (max-width: 360px) {
    #container {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    }
      
    .nav {  
    display: none;
    }
    
    label.mobile_menu span {
    display: inline;
    }
    
    label.mobile_menu {
    position: relative;
    display: block;
    width: 100%;
    background: #51C1F1;
    padding: 10px 0;
    }
    
    #mobile_menu:checked+.nav {
    display: block;
    }
    
    label:after {
    position: absolute;
    top:0px;
    right: 10px;
    content: "\2261";
    font-size: 30px;
    color: white;
    }
    
    .nav {
    padding: 0;
    }
    
    .nav li {
    width: 100%;
    text-align: left;
    margin-left: 0;
    }
    
    .nav > li {
    border-right: none;
    padding: 18px 0px;
    position: relative;
    }
    
    .nav > li > a {
    display: inline;
    }
    
    .nav li ul  {
    top:45px;
    }
    
    .nav li ul {
    padding: 0;
    }
    
    .nav li > ul li {
    padding: 18px 0px;
    }
    
    .nav > li > ul {
    width: 100%;
    }
    
    .nav > li > ul li ul {
    width: 100%;
    top:43px;
    left: 0;
    margin-top: 30px;
    z-index:2;
    }
    
    .nav > li > ul > li:hover ul {
    margin-top: 0;
    }
    
    .nav > li > ul li ul li ul {
    width: 100%;
    top:43px;
    left: 0px;
    margin-left: 0;
    margin-top: 30px;
    }
    
    .nav > li > ul > li ul li:hover ul{
    margin-top: 0;
    }
    
    .nav > li > ul li{ 
    padding: 15px 0 15px 6%;
    width: 94%;
    }
    
    .nav > li > ul li ul li{ 
    padding: 15px 0 15px 9%;
    width: 91%;
    }
    
    .nav > li > ul li ul li ul li{ 
    padding: 15px 0 15px 12%;
    width: 88%;
    }
    
    .nav ul li.dropdown:after {
    left: 90%;
    }
    
    /************ Categories Menu *****************/
    
    #menu {  
    display: none;
    }
    
    label.mainmenu-mobile span {
    display: inline;
    }
    
    label.mainmenu-mobile {
    position: relative;
    display: block;
    width: 100%;
    background: #51C1F1;
    padding: 10px 0;
    }
    
    #mainmenu-mobile:checked+#menu {
    display: block;
    }
    
    label:after {
    position: absolute;
    top:0px;
    right: 10px;
    content: "\2261";
    font-size: 30px;
    color: white;
    }
    
    #menu {
    padding: 0;
    }
    
    #menu li {
    width: 100%;
    text-align: left;
    margin-left: 0;
    }
    
    #menu > li {
    border-right: none;
    padding: 18px 0px;
    position: relative;
    }
    
    #menu > li > a {
    display: inline;
    }
    
    #menu li ul  {
    top:45px;
    }
    
    #menu li ul {
    padding: 0;
    }
    
    #menu li > ul li {
    padding: 18px 0px;
    }
    
    #menu > li > ul {
    width: 100%;
    }
    
    #menu > li > ul li ul {
    width: 100%;
    top:43px;
    left: 0;
    margin-top: 30px;
    z-index:2;
    }
    
    #menu > li > ul > li:hover ul {
    margin-top: 0;
    }
    
    #menu > li > ul li ul li ul {
    width: 100%;
    top:43px;
    left: 0px;
    margin-left: 0;
    margin-top: 30px;
    }
    
    #menu > li > ul > li ul li:hover ul{
    margin-top: 0;
    }
    
    #menu > li > ul li{ 
    padding: 15px 0 15px 6%;
    width: 94%;
    }
    
    #menu > li > ul li ul li{ 
    padding: 15px 0 15px 9%;
    width: 91%;
    }
    
    #menu > li > ul li ul li ul li{ 
    padding: 15px 0 15px 12%;
    width: 88%;
    }
    
    #menu ul li.dropdown:after {
    left: 90%;
    }
    
    #footer .col {
    	float: none;
    }
    
    }
    
    @media screen (max-width: 320px) {
    #container {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    }
      
    .nav {  
    display: none;
    }
    
    label.mobile_menu span {
    display: inline;
    }
    
    label.mobile_menu {
    position: relative;
    display: block;
    width: 100%;
    background: #51C1F1;
    padding: 10px 0;
    }
    
    #mobile_menu:checked+.nav {
    display: block;
    }
    
    label:after {
    position: absolute;
    top:0px;
    right: 10px;
    content: "\2261";
    font-size: 30px;
    color: white;
    }
    
    .nav {
    padding: 0;
    }
    
    .nav li {
    width: 100%;
    text-align: left;
    margin-left: 0;
    }
    
    .nav > li {
    border-right: none;
    padding: 18px 0px;
    position: relative;
    }
    
    .nav > li > a {
    display: inline;
    }
    
    .nav li ul  {
    top:45px;
    }
    
    .nav li ul {
    padding: 0;
    }
    
    .nav li > ul li {
    padding: 18px 0px;
    }
    
    .nav > li > ul {
    width: 100%;
    }
    
    .nav > li > ul li ul {
    width: 100%;
    top:43px;
    left: 0;
    margin-top: 30px;
    z-index:2;
    }
    
    .nav > li > ul > li:hover ul {
    margin-top: 0;
    }
    
    .nav > li > ul li ul li ul {
    width: 100%;
    top:43px;
    left: 0px;
    margin-left: 0;
    margin-top: 30px;
    }
    
    .nav > li > ul > li ul li:hover ul{
    margin-top: 0;
    }
    
    .nav > li > ul li{ 
    padding: 15px 0 15px 6%;
    width: 94%;
    }
    
    .nav > li > ul li ul li{ 
    padding: 15px 0 15px 9%;
    width: 91%;
    }
    
    .nav > li > ul li ul li ul li{ 
    padding: 15px 0 15px 12%;
    width: 88%;
    }
    
    .nav ul li.dropdown:after {
    left: 90%;
    }
    
    /************ Categories Menu *****************/
    
    #menu {  
    display: none;
    }
    
    label.mainmenu-mobile span {
    display: inline;
    }
    
    label.mainmenu-mobile {
    position: relative;
    display: block;
    width: 100%;
    background: #51C1F1;
    padding: 10px 0;
    }
    
    #mainmenu-mobile:checked+#menu {
    display: block;
    }
    
    label:after {
    position: absolute;
    top:0px;
    right: 10px;
    content: "\2261";
    font-size: 30px;
    color: white;
    }
    
    #menu {
    padding: 0;
    }
    
    #menu li {
    width: 100%;
    text-align: left;
    margin-left: 0;
    }
    
    #menu > li {
    border-right: none;
    padding: 18px 0px;
    position: relative;
    }
    
    #menu > li > a {
    display: inline;
    }
    
    #menu li ul  {
    top:45px;
    }
    
    #menu li ul {
    padding: 0;
    }
    
    #menu li > ul li {
    padding: 18px 0px;
    }
    
    #menu > li > ul {
    width: 100%;
    }
    
    #menu > li > ul li ul {
    width: 100%;
    top:43px;
    left: 0;
    margin-top: 30px;
    z-index:2;
    }
    
    #menu > li > ul > li:hover ul {
    margin-top: 0;
    }
    
    #menu > li > ul li ul li ul {
    width: 100%;
    top:43px;
    left: 0px;
    margin-left: 0;
    margin-top: 30px;
    }
    
    #menu > li > ul > li ul li:hover ul{
    margin-top: 0;
    }
    
    #menu > li > ul li{ 
    padding: 15px 0 15px 6%;
    width: 94%;
    }
    
    #menu > li > ul li ul li{ 
    padding: 15px 0 15px 9%;
    width: 91%;
    }
    
    #menu > li > ul li ul li ul li{ 
    padding: 15px 0 15px 12%;
    width: 88%;
    }
    
    #menu ul li.dropdown:after {
    left: 90%;
    }
    
    #footer .col {
    	float: none;
    }
    
    }

  • #2
    New to the CF scene
    Join Date
    Aug 2013
    Posts
    3
    Thanks
    0
    Thanked 1 Time in 1 Post
    Did you clear your cache to check the changes? I advise you to clear your cache since your code looks good!


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •