Inline vs Block
Does a block element start on a new line?
Yes
Which CSS property controls what happens when content is too big for its box?
overflow
What HTML tag is used to set the viewport for responsive design?
<meta name="viewport" ...>
What display value activates Flexbox on a container?
display: flex
What display value activates CSS Grid layout on a container?
display: grid
What is the default display type of a <div>?
block
Which overflow value hides content that doesn’t fit?
hidden
What CSS feature lets you apply different rules at different screen widths?
Media queries
Which property sets the direction of the main axis in Flexbox?
flex-direction
Which property defines the columns in a grid?
grid-template-columns
What is the default display type of a <span>?
inline
Which overflow value adds scrollbars when content is too big?
scroll (or auto)
Which unit is better for responsive design: px or vw/%?
vw / % (relative units)
Which property controls how items are spaced along the main axis?
justify-content
Which property defines the rows in a grid?
grid-template-rows
Which type of element can have width and height reliably applied: inline or block?
Block elements
Which position value positions an element relative to the normal flow (and supports top, left offsets)?
relative
Which CSS properties make an image scale down with its container?
max-width: 100%; height: auto;
Which property controls how items are aligned on the cross axis?
align-items
Which property sets spacing between rows and columns?
gap (or row-gap/column-gap)
What CSS property can turn an inline element into a block-level element?
display: block
Which position value positions an element relative to the viewport and keeps it in place while scrolling?
fixed
What’s the main goal of responsive design?
Make layouts work well on different screens and devices
Which property allows flex items to wrap onto a new line?
flex-wrap
What shorthand defines 3 equal-width columns using fractions?
grid-template-columns: repeat(3, 1fr);