Website Design CSS Layout and Grid Systems 2

Question 1

What CSS Grid property is used to define the number and size of columns?

Accepted Answer

grid-template-columns

Answer

grid-columns

Answer

grid-column-layout

Answer

columns

Question 2

What does `justify-content: center` do in Flexbox?

Accepted Answer

Centers flex items along the main axis of the container

Answer

Centers text within flex items

Answer

Applies center alignment to the cross axis

Answer

Centers the flex container itself on the page

Question 3

What is the difference between `position: absolute` and `position: relative` in CSS?

Accepted Answer

Absolute positions relative to the nearest positioned ancestor; relative shifts from its normal position

Answer

Absolute uses percentages; relative uses pixels

Answer

Absolute removes the element from the page; relative hides it

Answer

They are interchangeable in modern CSS

Question 4

What is a CSS 'breakpoint'?

Accepted Answer

A specific screen width at which styles change for responsive design

Answer

A CSS error that halts rendering

Answer

A CSS animation pause point

Answer

The maximum width of a CSS container

Question 5

What does `align-items: stretch` do in a Flexbox container?

Accepted Answer

Stretches flex items to fill the container's cross-axis height

Answer

Stretches the container to fill the viewport

Answer

Distributes items with equal spacing

Answer

Aligns items to the baseline of the text

Question 6

What does `z-index` control in CSS positioning?

Accepted Answer

The stacking order of positioned elements on the z-axis (depth)

Answer

The zoom level of an element

Answer

The opacity level of layered elements

Answer

The order of elements in the DOM