CSS Layout Debugging Survey

Intro

Hello! Thanks so much for taking the time to help us make better tools. Your input on CSS layout bugs will be invaluable for our continuing work on new tool concepts like the Flexbox and Grid Inspectors.

This one-page survey should take less than 5 minutes, and your answers will remain anonymous unless you choose to give us your email address.

—Victoria & the Firefox DevTools team

1. Before we dive in, how would you rate your CSS skills? *This question is required.

CSS Layout Bug Ranking

Choose the 5 most time-consuming CSS bugs you’ve faced in the last 3 months. Drag them into the right column.
Sort them by how time-consuming they are (1 being most time-consuming, 5 being least.)

Don’t worry about each question too much—trust your gut!

*This question is required. Order the items from the following list. First select an item with the spacebar to show a menu of possible ranking positions. Next, click a ranking position to order it in the ranked list. Note the menu will display more ordering options as you add items to the ranked list.

Spacing-Inline
(Where is this spacing between inline elements coming from?)
Fit
(e.g. Why isn’t this element confined into this space?)
Flow
(e.g. Why does this get pushed onto the next line?)
Margins
(e.g. What’s causing this unexpected margin size?)
Alignment-Vertical
(e.g. Why isn’t this vertically aligned correctly?)
Dependencies
(e.g. How does this CSS affect other CSS declarations in the same rule?)
Spacing-Vertical
(Why is there unexpected spacing above/below this element?)
Stacking
(e.g. Why isn’t z-index fixing this overlapped element?)
Size
(e.g. How did this element end up with this width/height?)
Alignment-Horizontal
(e.g. Why isn’t this horizontally centered?)
Inactivity
(e.g. Why doesn’t this CSS declaration do anything?)
Position
(e.g. How did this element end up in this position?)
Relationships
(e.g. How are other elements affecting this element's attributes?)
Overflow
(e.g. Where is this unwanted scrollbar coming from?)

3. Did we miss anything?

4. If you could wave a magic wand, what’s the one CSS debugging-related feature you’d want to have in browser DevTools?

5. (Optional) Would you be interested in participating in compensated research interviews with the Firefox DevTools team?

What's your email address?
(Email addresses will only be seen by Mozilla employees involved in this research project, and will be deleted after 3 months.)
This question requires a valid email address.