html - Strange behavior of media query in CSS. Inheriting attribute values from other statement -


let's have

@media , (min-width: 360px) {     #navigation {         background-color: #dddddd;          display: block;          position: fixed;          top: 0px;     } } @media , (min-width: 760px) {     #navigation {         background-color: #111111;          display: none;          position: fixed;          bottom: 0px;     } } 

this kind of css code (assume have div id="navigation" tag in body tag.).

but if run code , change size of browser see difference, won't change size changes. css attributes in first media query statement applied style, except display attribute.

how make other attributes behave supposed be?

edit: here's codepen project: http://codepen.io/thatkoreanguy/pen/mjwpbw

ok going assume main problem here when going 360px width div not sitting @ top of view port stuck @ bottom?

when have media query still inherits previous styles if want negate have return them there default value bottom auto believe.


Comments

Popular posts from this blog

javascript - oscilloscope of speaker input stops rendering after a few seconds -

javascript - gulp-nodemon - nodejs restart after file change - Error: listen EADDRINUSE events.js:85 -

Fatal Python error: Py_Initialize: unable to load the file system codec. ImportError: No module named 'encodings' -