[Webkit-unassigned] [Bug 65626] New: Web Inspector: Show media queries associated with specific CSS rules

[bugzilla-daemon at webkit.org]

https://bugs.webkit.org/show_bug.cgi?id=65626

           Summary: Web Inspector: Show media queries associated with
                    specific CSS rules
           Product: WebKit
           Version: 528+ (Nightly build)
          Platform: All
        OS/Version: All
            Status: UNCONFIRMED
          Severity: Normal
          Priority: P2
         Component: Web Inspector
        AssignedTo: webkit-unassigned at lists.webkit.org
        ReportedBy: zachleatherman at gmail.com
                CC: timothy at apple.com, rik at webkit.org, keishi at webkit.org,
                    pmuellr at yahoo.com, joepeck at webkit.org,
                    pfeldman at chromium.org, yurys at chromium.org,
                    bweinstein at apple.com, apavlov at chromium.org,
                    loislo at chromium.org


This is probably best explained with an example.

Go to http://jquerymobile.com/test/
Inspect div.content-secondary
When the window >= 650px, the width of this element is set to 45%.
When I resize the window < 650px, there is no width set.

There currently is no visual indicator that exists when the width is set to 45% that it is conditional on a media query.  I would like this to be explicit in the web inspector styles.

Maybe something like this in the Styles pane:

@media all and (min-width: 650px){              jqm-docs.css:150
  .content-secondary {                          jqm-docs.css:178
    text-align: left;
    float: left;
    width: 45%;
    background: none;
    border-top: 0;
  }
}

-- 
Configure bugmail: https://bugs.webkit.org/userprefs.cgi?tab=email
------- You are receiving this mail because: -------
You are the assignee for the bug.