HTML and CSS interview questions

The modern answer is flex on the parent with justify-content and align-items set to center, or grid with place-items center.

Flex-grow is how leftover space is shared

I use a grid with two columns on min-width 768 and one column in the base styles.

Z-index is compared only inside the same stacking context.

Fixed is relative to the viewport and stays put even when you scroll the page.

I start with a button that has aria-expanded and aria-controls pointing at the list.

Inside a form, the default type is submit, so a random button can post the form by accident.

Aria-label is a string on the element itself.

Native input type checkbox is best.

Inline styles beat classes and ids unless a rule uses important.

They are variables defined with a double-dash name, often on :root, and read with var.

Required, type email, minlength, and pattern give native validation even if JS fails.

It is the first focusable link that jumps to main content so keyboard users skip the nav.

I name cells and draw the layout as ASCII in CSS, which is easier to review than long line and column numbers.

Media queries apply CSS only when the viewport or device matches a condition like max-width.

absolute positions relative to a positioned ancestor.