PHASE 2

What happens if the .container class is removed from the HTML?

• The .box element will disappear.

• The .box element will stay in the center of the page.

• The .box element will move to the top-left corner of the page.

• The layout will break, and the .box element will be misaligned.

What will happen if the .item class has a flex-grow: 1; property added?

• All items will have equal width and fill the container space.

• Item 1 will expand to fill the remaining space.

• Item 3 will expand to fill the remaining space.

• Items will remain unchanged in width.

What will happen if the .child class has a position: absolute; property added?

• The child element will move outside the parent container.

• The child element will be positioned relative to its parent.

• The child element will be positioned at the center of the section.

• The child element will be hidden from view.

What will be the total width of the .box element, including the content, padding, border, and margin?

• 220px

• 260px

• 244px

• 280px

What will be the color of 'Item 2' in the list?

• Blue

• Red

• Black

• Green

Which box will be displayed on top?

• .box1

• .box2

• Both will overlap

• None, because of the same z-index value

What effect will the above media query have on the .container class?

• It will change the container's background color.

• It will change the container's flex-direction to row.

• It will change the container's flex-direction to column when the screen width is 600px or less.

• It will hide the container when the screen width exceeds 600px.

What will be the visible area of the .child element inside the .parent element?

• The entire .child element will be visible, overflowing the parent container.

• Only the part of the .child element that fits within the parent's width and height will be visible.

• The .child element will not be visible due to the overflow property.

• The .child element will be resized to fit perfectly inside the parent.

What will be the order of the items when using the provided CSS?

• 1, 2, 3

• 1, 3, 2

• 2, 1, 3

• 2, 3, 1

What will be the positioning of .box2 concerning .box1?

• .box2 will appear below .box1.

• .box2 will float right of .box1.

• .box2 will overlap .box1.

• .box2 will not be visible due to the float property.