4 ms·

this should have been an extension... seems too specialized to a technic I hope will not endure the test of time.

by gcb0 9y ago

extra88 9y ago
You could just as easily say all dev tools should be omitted from all browsers and made available as extensions instead. You hope web designers won't take to using CSS Grid? Do you think sticking with hacks like floats is better?
- pdog 9y ago
  Use Flexbox. CSS Grid doesn't solve anything you can't already do with Flexbox. They're both optimized for user interface design.
  - sametmax 9y ago
    Many css grids are todays actually made with flexbox. Bootstrap 4 does that. But this tool is actually about the "grid" property, which is a nice tool to do grids natively.
  - SimeVidas 9y ago
    The entire CSS Working Group just facepalmed.
  - extra88 9y ago
    Here are a couple of articles that should help explain when CSS Grid would be a better choice than Flexbox. https://rachelandrew.co.uk/archives/2016/03/30/should-i-use-grid-or-flexbox/ https://rachelandrew.co.uk/archives/2016/03/30/should-i-use-... https://css-tricks.com/css-grid-replace-flexbox/ https://css-tricks.com/css-grid-replace-flexbox/ BTW, Microsoft Edge has the current CSS Grid syntax available behind a feature flag (available in Windows 10 Insider Preview build 16226). https://wpdev.uservoice.com/forums/257854-microsoft-edge-developer/suggestions/6514853-update-css-grid https://wpdev.uservoice.com/forums/257854-microsoft-edge-dev...
  - saidajigumi 9y ago
    This is categorically false. CSS Grid and Flexbox do have overlap, but Grid complements Flexbox, and the two together get a LOT closer to the "holy grail" of purely semantic markup then either alone. That, in turn, has real benefits: the less "styling" nonsense is baked into your markup, the more powerful the ability to use CSS media queries and other tools to transform the presentation based on device and other contextual information (e.g. different embedding of the same content) FWIW, I've shipped "grid in Flexbox" sites. Flexbox was better than the-bad-old-days, but still kinda sucked, simply because of the hacks needed to make Flexbox approach grid layout.
SimeVidas 9y ago
The purpose of Firefox Developer Tools is to make debugging web pages easier for web developers. It’s not meant to be used by regular users. Inspecting elements and their applied styles is an integral part of web development, and this just makes it easier to debug grid layouts.
- mbrookes 9y ago
  > It’s not meant to be used by regular users. That, I believe, was the foundation of @gbc0's point. And on that basis I'm inclined to agree - why download, install and run for every user a set of tools that could as easily be installed the first time they are accessed?
  - masklinn 9y ago
    Because while it's not for every "regular user", it's a tinkering tool which allows some "regular users" to start diving into the guts of the machine, get better insight and possibly decide to make it their life's work, in much the same way many of us got started because we had machines which let us peek and prod "under the cover" so to speak.
    - extra88 9y ago
      Yes. "View source" being in pretty much every browser from the beginning has been an important part of the democratizing nature of the web. As web sites and development have gotten more complex, have dev tools baked into most browsers and continually adding capability helps reduce the barrier to entry. I appreciate that Firefox has chosen to differentiate their dev tools from others by adding a tool like this. Google Chrome dev tools seem to be more focused on performance testing. It wouldn't be a bad thing if one set of dev tools was better for performance and JavaScript debugging and other was better for solving visual design problems.
      - junglecode 9y ago
        Indeed. Expressiveness has not been a big focus in the past. We'd like to change that with Firefox. What kinds of tools would you like to see for solving visual design problems?
tomatsu 9y ago
Having the dev tools integrated means that they are still available if you're using some machine (e.g. a school PC) where you cannot install extensions.

this should have been an extension... seems too specialized to a technic I hope will not endure the test of time.

by gcb0 9y ago

this should have been an extension... seems too specialized to a technic I hope will not endure the test of time.

You could just as easily say all dev tools should be omitted from all browsers and made available as extensions instead. You hope web designers won't take to using CSS Grid? Do you think sticking with hacks like floats is better?

pdog 9y ago
Use Flexbox. CSS Grid doesn't solve anything you can't already do with Flexbox. They're both optimized for user interface design.
- sametmax 9y ago
  Many css grids are todays actually made with flexbox. Bootstrap 4 does that. But this tool is actually about the "grid" property, which is a nice tool to do grids natively.
- SimeVidas 9y ago
  The entire CSS Working Group just facepalmed.
- extra88 9y ago
  Here are a couple of articles that should help explain when CSS Grid would be a better choice than Flexbox. https://rachelandrew.co.uk/archives/2016/03/30/should-i-use-grid-or-flexbox/ https://rachelandrew.co.uk/archives/2016/03/30/should-i-use-... https://css-tricks.com/css-grid-replace-flexbox/ https://css-tricks.com/css-grid-replace-flexbox/ BTW, Microsoft Edge has the current CSS Grid syntax available behind a feature flag (available in Windows 10 Insider Preview build 16226). https://wpdev.uservoice.com/forums/257854-microsoft-edge-developer/suggestions/6514853-update-css-grid https://wpdev.uservoice.com/forums/257854-microsoft-edge-dev...
- saidajigumi 9y ago
  This is categorically false. CSS Grid and Flexbox do have overlap, but Grid complements Flexbox, and the two together get a LOT closer to the "holy grail" of purely semantic markup then either alone. That, in turn, has real benefits: the less "styling" nonsense is baked into your markup, the more powerful the ability to use CSS media queries and other tools to transform the presentation based on device and other contextual information (e.g. different embedding of the same content) FWIW, I've shipped "grid in Flexbox" sites. Flexbox was better than the-bad-old-days, but still kinda sucked, simply because of the hacks needed to make Flexbox approach grid layout.

SimeVidas 9y ago

The purpose of Firefox Developer Tools is to make debugging web pages easier for web developers. It’s not meant to be used by regular users. Inspecting elements and their applied styles is an integral part of web development, and this just makes it easier to debug grid layouts.

mbrookes 9y ago
> It’s not meant to be used by regular users. That, I believe, was the foundation of @gbc0's point. And on that basis I'm inclined to agree - why download, install and run for every user a set of tools that could as easily be installed the first time they are accessed?
- masklinn 9y ago
  Because while it's not for every "regular user", it's a tinkering tool which allows some "regular users" to start diving into the guts of the machine, get better insight and possibly decide to make it their life's work, in much the same way many of us got started because we had machines which let us peek and prod "under the cover" so to speak.
  - extra88 9y ago
    Yes. "View source" being in pretty much every browser from the beginning has been an important part of the democratizing nature of the web. As web sites and development have gotten more complex, have dev tools baked into most browsers and continually adding capability helps reduce the barrier to entry. I appreciate that Firefox has chosen to differentiate their dev tools from others by adding a tool like this. Google Chrome dev tools seem to be more focused on performance testing. It wouldn't be a bad thing if one set of dev tools was better for performance and JavaScript debugging and other was better for solving visual design problems.
    - junglecode 9y ago
      Indeed. Expressiveness has not been a big focus in the past. We'd like to change that with Firefox. What kinds of tools would you like to see for solving visual design problems?

tomatsu 9y ago

Having the dev tools integrated means that they are still available if you're using some machine (e.g. a school PC) where you cannot install extensions.