border of 2px, which is on all 4 sides, adds 2px on the left and 2px on the right. 4px.
On Thu Nov 20 2014 at 9:47:11 PM Crest Christopher < crestchristop...@gmail.com> wrote: > Why is it adding 4px for left and right ? I'm reading up on box-sizing, > I don't see the benefit ? > > Christopher > > Russ McMullin <mailto:r...@catjuggling.com> > > Thursday, November 20, 2014 9:21 PM > > I suspect the scroll bar is from telling #menupanel to be 320px, plus > > a border of 2px, which would make it 324px wide, unless you are using > > box-sizing:border-box;. That is where I would start looking. > > > > Russ > > > > > > 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/ > ______________________________________________________________________ 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/
