Flexbox interview questions

24 real Flexbox questions from the CSS bank, as asked in Indian campus drives and tech interviews. Every question has a verified answer and an AI-tutor explanation on placd — free to start.

1. What is justify-content?

Junior
  1. A.the property overriding cross-axis alignment for a single item rather than the whole container
  2. B.the factor controlling how much a flex item expands to fill remaining free space relative to siblings
  3. C.the flex property that aligns items along the main axis
  4. D.the flex property that aligns items along the cross axis
Reveal the answer + AI explanation — free account

3. Which statement is correct?

Junior
  1. A.justify-content — the property setting whether the main axis runs horizontally as a row or vertically as a column
  2. B.justify-content — the flex property that aligns items along the cross axis
  3. C.justify-content — the flex property that aligns items along the main axis
  4. D.justify-content — the property setting the initial main-size of a flex item before growing or shrinking is applied
Reveal the answer + AI explanation — free account

4. What is align-items?

Junior
  1. A.the factor controlling how much a flex item expands to fill remaining free space relative to siblings
  2. B.the flex property that aligns items along the cross axis
  3. C.the property allowing items to flow onto multiple lines when they exceed the container width
  4. D.the property setting the initial main-size of a flex item before growing or shrinking is applied
Reveal the answer + AI explanation — free account

6. Which statement is correct?

Junior
  1. A.align-items — the factor controlling how much a flex item contracts when there is not enough space
  2. B.align-items — the flex property that aligns items along the cross axis
  3. C.align-items — the factor controlling how much a flex item expands to fill remaining free space relative to siblings
  4. D.align-items — the flex property that aligns items along the main axis
Reveal the answer + AI explanation — free account

7. What is flex-grow?

Mid
  1. A.the factor controlling how much a flex item contracts when there is not enough space
  2. B.the factor controlling how much a flex item expands to fill remaining free space relative to siblings
  3. C.the property setting whether the main axis runs horizontally as a row or vertically as a column
  4. D.the flex property that aligns items along the cross axis
Reveal the answer + AI explanation — free account

9. Which statement is correct?

Mid
  1. A.flex-grow — the factor controlling how much a flex item contracts when there is not enough space
  2. B.flex-grow — the flex property that aligns items along the cross axis
  3. C.flex-grow — the flex property that aligns items along the main axis
  4. D.flex-grow — the factor controlling how much a flex item expands to fill remaining free space relative to siblings
Reveal the answer + AI explanation — free account

10. What is flex-shrink?

Mid
  1. A.the flex property that aligns items along the main axis
  2. B.the flex property that aligns items along the cross axis
  3. C.the factor controlling how much a flex item contracts when there is not enough space
  4. D.the property setting whether the main axis runs horizontally as a row or vertically as a column
Reveal the answer + AI explanation — free account

12. Which statement is correct?

Mid
  1. A.flex-shrink — the factor controlling how much a flex item contracts when there is not enough space
  2. B.flex-shrink — the property overriding cross-axis alignment for a single item rather than the whole container
  3. C.flex-shrink — the flex property that aligns items along the cross axis
  4. D.flex-shrink — the property setting the initial main-size of a flex item before growing or shrinking is applied
Reveal the answer + AI explanation — free account

13. What is flex-basis?

Mid
  1. A.the factor controlling how much a flex item contracts when there is not enough space
  2. B.the property setting the initial main-size of a flex item before growing or shrinking is applied
  3. C.the property setting whether the main axis runs horizontally as a row or vertically as a column
  4. D.the flex property that aligns items along the main axis
Reveal the answer + AI explanation — free account

15. Which statement is correct?

Mid
  1. A.flex-basis — the property allowing items to flow onto multiple lines when they exceed the container width
  2. B.flex-basis — the factor controlling how much a flex item expands to fill remaining free space relative to siblings
  3. C.flex-basis — the property setting the initial main-size of a flex item before growing or shrinking is applied
  4. D.flex-basis — the property setting whether the main axis runs horizontally as a row or vertically as a column
Reveal the answer + AI explanation — free account

16. What is flex-direction?

Junior
  1. A.the property allowing items to flow onto multiple lines when they exceed the container width
  2. B.the property setting whether the main axis runs horizontally as a row or vertically as a column
  3. C.the property overriding cross-axis alignment for a single item rather than the whole container
  4. D.the factor controlling how much a flex item expands to fill remaining free space relative to siblings
Reveal the answer + AI explanation — free account

18. Which statement is correct?

Junior
  1. A.flex-direction — the flex property that aligns items along the cross axis
  2. B.flex-direction — the property setting the initial main-size of a flex item before growing or shrinking is applied
  3. C.flex-direction — the flex property that aligns items along the main axis
  4. D.flex-direction — the property setting whether the main axis runs horizontally as a row or vertically as a column
Reveal the answer + AI explanation — free account

19. What is align-self?

Mid
  1. A.the property allowing items to flow onto multiple lines when they exceed the container width
  2. B.the property overriding cross-axis alignment for a single item rather than the whole container
  3. C.the factor controlling how much a flex item contracts when there is not enough space
  4. D.the property setting the initial main-size of a flex item before growing or shrinking is applied
Reveal the answer + AI explanation — free account

21. Which statement is correct?

Mid
  1. A.align-self — the property setting the initial main-size of a flex item before growing or shrinking is applied
  2. B.align-self — the property overriding cross-axis alignment for a single item rather than the whole container
  3. C.align-self — the factor controlling how much a flex item contracts when there is not enough space
  4. D.align-self — the flex property that aligns items along the main axis
Reveal the answer + AI explanation — free account

22. What is flex-wrap?

Senior
  1. A.the property setting whether the main axis runs horizontally as a row or vertically as a column
  2. B.the property allowing items to flow onto multiple lines when they exceed the container width
  3. C.the property overriding cross-axis alignment for a single item rather than the whole container
  4. D.the property setting the initial main-size of a flex item before growing or shrinking is applied
Reveal the answer + AI explanation — free account

24. Which statement is correct?

Senior
  1. A.flex-wrap — the flex property that aligns items along the main axis
  2. B.flex-wrap — the property setting the initial main-size of a flex item before growing or shrinking is applied
  3. C.flex-wrap — the property allowing items to flow onto multiple lines when they exceed the container width
  4. D.flex-wrap — the flex property that aligns items along the cross axis
Reveal the answer + AI explanation — free account

Free to start

Answers, AI explanations, and a scored voice mock interview

Sign up free to check your answers with explanations, ask the AI tutor anything on any question, and take one full AI mock interview — scored like a real panel.

Practice Flexbox free