CSS CSS Box Model & Spacing 2

Question 1

What is 'margin collapsing' in CSS?

Accepted Answer

When adjacent vertical margins combine into a single margin equal to the largest value

Answer

Margin collapsing occurs when vertical margins of adjacent block elements merge into one margin whose size is the largest of the individual margins.

Question 2

Which layout context prevents margin collapsing from occurring between parent and child elements?

Accepted Answer

Flex formatting context

Answer

Flex containers create a flex formatting context, which prevents margin collapsing between the container and its flex items.

Question 3

Given `padding: 5px 10px 15px`, what is the computed padding for the left side?

Accepted Answer

10px

Answer

With three values, the pattern is: top=5px, left/right=10px, bottom=15px — so the left side inherits the second value.

Question 4

Which CSS property specifies the space outside an element's border, pushing away surrounding elements?

Accepted Answer

margin

Answer

Margin creates space on the outside of the border, creating distance between an element and its neighbors.

Question 5

What is the effect of setting a negative margin value in CSS?

Accepted Answer

It pulls the element toward the direction of the negative margin, potentially overlapping other content

Answer

Negative margins pull elements in the specified direction, reducing the space and potentially causing overlap with adjacent elements.

CSS Language Practice Test