In a flex container with flex-direction: row and a fixed height, which combination centers items vertically and distributes them along the row?

In a flex container with flex-direction: row and a fixed height, which combination centers items vertically and distributes them along the row?

• A. justify-content: center; align-items: space-between
• B. align-items: baseline; justify-content: space-around
• C. align-items: center to center vertically; justify-content: space-between to distribute along the row.
• D. align-items: stretch; justify-content: space-evenly

Answer: (C)

In a row-oriented flex container, the main axis runs horizontally and the cross axis runs vertically. To center items vertically within a fixed height, you use align-items: center, which aligns each item along the cross axis to the center. To distribute items along the row, you use justify-content with space-between, which places the first item at the start, the last at the end, and equal space between adjacent items. Put together, this combination centers the items vertically and spreads them evenly across the row. Other align-items values won’t center vertically: stretch would make items fill the height, baseline aligns to text baselines, and so on. For horizontal distribution, space-between specifically pushes items to the edges with equal gaps between them, unlike space-around or space-evenly which add different spacing patterns.

In a row-oriented flex container, the main axis runs horizontally and the cross axis runs vertically. To center items vertically within a fixed height, you use align-items: center, which aligns each item along the cross axis to the center. To distribute items along the row, you use justify-content with space-between, which places the first item at the start, the last at the end, and equal space between adjacent items. Put together, this combination centers the items vertically and spreads them evenly across the row.

Other align-items values won’t center vertically: stretch would make items fill the height, baseline aligns to text baselines, and so on. For horizontal distribution, space-between specifically pushes items to the edges with equal gaps between them, unlike space-around or space-evenly which add different spacing patterns.