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.

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

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.