Open Bug 1430473 Opened 3 years ago Updated 2 years ago

Highlight CSS Grid's named-lines and named-areas when hover above CSS value

Categories

(DevTools :: Inspector: Rules, enhancement, P3)

58 Branch
enhancement

Tracking

(Not tracked)

UNCONFIRMED

People

(Reporter: mike, Unassigned)

References

(Blocks 1 open bug)

Details

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/63.0.3239.132 Safari/537.36

Steps to reproduce:

GSS Grid allows for "named areas" using the grid-template-area property. See https://developer.mozilla.org/en-US/docs/Web/CSS/grid-template-areas .

Similarly for CSS Grid also allows for "named lines" using the grid-template-columns and grid-template-rows properties. See https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout/Layout_using_Named_Grid_Lines .



Expected results:

It would be extremely valuable if when hovering your mouse over an an area's name, the corresponding area would highlight within the webpage.

Similarly, it would also be extremely awesomely, super-duper helpful if the corresponding line would highlight when the text for the named line is hovered over in the CSS property.
Severity: normal → enhancement
Component: Untriaged → Developer Tools: CSS Rules Inspector
Blocks: dt-grid
Priority: -- → P3
Summary: [DevTools Feature Request] Highlight CSS Grid's named-lines and named-areas when hover above CSS value → Highlight CSS Grid's named-lines and named-areas when hover above CSS value
Product: Firefox → DevTools
You need to log in before you can comment on or make changes to this bug.