While flexible-elements CSS feature are powerful, yet the complexity makes it cumbersome for many developers; Mozilla wants to ease things up with the launch of Flexbox Inspector as part of FirefoxDevTools for examining CSS Flexbox layouts.
The new dev tool is based on the concepts of CSS Grid Inspector, though CSS Flexbox learning curve is rather a bit complex, Mozilla seeks to help developers to build the basic feature set and to better understand the sizing, positioning, and nesting of Flexbox elements.
CSS Flexbox Layouts growing popularity is as a result of its capabilities in developing dynamic page layouts, and as a CSS module defining CSS box model for optimized user interface design, with layout in one dimension.
The company conducted a research on design-focused tools including interviews with developer/designer friends and community members on what new features they wanted to see, and the Min/max width and height constraints received the highest score.
They gathered data from the community to help in building the basic set of features, with the shrink/grow features having a higher-than-expected ranking.
Mozilla is looking to build—better debugging tools for all types of CSS layouts and smoother workflows for CSS development, with lots of improvements coming to the Flexbox Inspector, and has welcomed developers to try out the tool via the DevEdition.
No comments