Figma - Frames and Layout
If a Figma frame has a 3-column grid with each column 120px wide and a gutter of 20px, what is the total width covered by the columns and gutters?
If a Figma frame has a 3-column grid with each column 120px wide and a gutter of 20px, what is the total width covered by the columns and gutters?
medium📝 Formula Result Q4 of 15
Step-by-Step Solution
Solution:
Step 1: Calculate total column width
3 columns x 120px = 360px total column width.Step 2: Calculate total gutter width
There are 2 gutters between 3 columns: 2 x 20px = 40px.Step 3: Add columns and gutters
360px + 40px = 400px total width.Final Answer:
400px -> Option BQuick Check:
Total width = Columns + Gutters = 400px [OK]
Quick Trick: Total width = (columns x width) + (gutters x count) [OK]
Common Mistakes:
MISTAKES- Forgetting gutters count is one less than columns
- Adding gutters equal to columns
- Mixing up column width and gutter size
Master "Frames and Layout" in Figma
Want More Practice?
15+ quiz questions · All difficulty levels · Free
Free Signup - Practice All QuestionsMore Figma Quizzes