Is it ok to have multiple items with different alignments with an online form? or does this break flow?

1. Which of the following property should be used for aligning the items?
2. What is the difference between align-items and align-content and align-self?
3. What is the use of align-items?
4. What is the difference between the align-content property and the align-items property?

Which of the following property should be used for aligning the items?

The align-items property specifies the default alignment for items inside the flexible container.

What is the difference between align-items and align-content and align-self?

align-items — controls alignment of all items on the cross axis. align-self — controls alignment of an individual flex item on the cross axis. align-content — described in the spec as for "packing flex lines"; controls space between flex lines on the cross axis.

What is the use of align-items?

The CSS align-items property sets the align-self value on all direct children as a group. In Flexbox, it controls the alignment of items on the Cross Axis. In Grid Layout, it controls the alignment of items on the Block Axis within their grid area.

What is the difference between the align-content property and the align-items property?

The align-content property determines how flex lines are aligned along the cross-axis while the align-items property determines how flex items are aligned within a flex line and along the cross-axis.