Can't overwrite CSS for media query -


https://codepen.io/everybodysfeelingwonderland/full/ojyrpm/

somehow can't change color of nav links smaller screen size in media query. should turn white, stays gray bigger screens.

@media , (max-width: 580px){ nav li a, nav ul li{ color: white; text-align: right; display: block; 

}

nav li { text-decoration: none; color: #666666; font-size: 20px;    

}

media queries not add specificity selector. control if code inside ignored or not.

which means that...

@media (condition) {   selector {     value   } } selector {   value } 

...will apply "another value", because it's placed later , has same specificity. need invert them , work intended:

a selector {   value } @media (condition) {   selector {     value   } } 

Comments

Popular posts from this blog

php - Vagrant up error - Uncaught Reflection Exception: Class DOMDocument does not exist -

vue.js - Create hooks for automated testing -

Add new key value to json node in java -