I see, you prefer min-width ?
Christopher
Tom Livingston <mailto:tom...@gmail.com>
Thursday, November 20, 2014 9:46 PM
No.
As I stated in my reply. I'm using MIN-WIDTH media queries. They are
"active" when the viewport is AT LEAST as wide as the dimension stated
and remain in effect until - in this case the bg color - is changed
inside another MQ. Look at my source.
Tom Livingston <mailto:tom...@gmail.com>
Thursday, November 20, 2014 9:39 PM
Look at this:
http://tomliv.com/css-d/mq/
I am using min-width. So the viewport needs to be *AT LEAST* as wide
as the dimension used. Can be wider, up to the next breakpoint (MQ).
Think mobile first...
Chris Rockwell <mailto:ch...@chrisrockwell.com>
Thursday, November 20, 2014 8:50 PM
Using a media query doesn't contribute to specificity, so your code
would work if you moved the declaration that sets the color to gray
above the media query.
If you wanted to get all "mobile first" on it, you could do:
#menupanel { background-color: red }
@media (min-width: 321px) { #menupanel { background-color: gray; } }
Chris Rockwell
Tom Livingston <mailto:tom...@gmail.com>
Thursday, November 20, 2014 8:46 PM
Try:
@media only screen and (min-width : 320px) {
#menupanel {background-color:red;height:400px;width:320px;border:2px;}
}
@media only screen and (min-width : 600px) {
#menupanel {background-color:gray;height:400px;width:500px;}
}
______________________________________________________________________
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/
