Display grid-template-areas value on multiple lines in the rules view

UNCONFIRMED
Unassigned

Status

P3
enhancement
UNCONFIRMED
a year ago
10 months ago

People

(Reporter: mike, Unassigned)

Tracking

(Blocks: 1 bug)

58 Branch

Firefox Tracking Flags

(Not tracked)

Details

(Reporter)

Description

a year ago
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:

The CSS Grid spec allows for you to create grid-template-areas in an ascii-art style matrix.


Actual results:

The issue is that when displaying the value for this property, devtools will output this onto one line. The same problem can also be caused by CSS minification . 
  


Expected results:

A proper solution would be to show each string on its own line, when displaying rules for grid-template-areas.
(Reporter)

Comment 1

a year ago
Helpful links:
MDN Docs for grid-template-areas: https://developer.mozilla.org/en-US/docs/Web/CSS/grid-template-areas
Codepen to mess around with: https://codepen.io/rachelandrew/pen/oXKgoQ
Severity: normal → enhancement
Component: Untriaged → Developer Tools: CSS Rules Inspector
Blocks: 1181227
Priority: -- → P3
Summary: [Feature Request DevTools] Display grid-template-areas value on multiple lines in dev tools → Display grid-template-areas value on multiple lines in the rules view

Updated

10 months ago
Product: Firefox → DevTools
You need to log in before you can comment on or make changes to this bug.