How to debug css inside different media queries with Firebug and Chrome Developer tools?

How to debug css for orientation:portrait in Chrome Developer tools?

What ever I write inside (orientation:portrait) can't edit on the fly from Firebug and Chrome Developer tools. It always shows the normal Properties.

/*normal styles here */
#wrap {
   width:1024px;
}
@media only screen and (orientation:portrait){
   /* portrait styles here */
   #wrap {
      width:768px;
   }
}