Question 1

What’s the `box-sizing` property?

Accepted Answer

It controls how the box model calculates size. `border-box` includes padding and borders in the width/height—makes life easier.

Question 2

How do you create a CSS circle?

Accepted Answer

Set equal width and height, then add `border-radius: 50%`. Boom, a perfect circle!

Question 3

What’s the `outline` property?

Accepted Answer

It draws a line around an element, outside the border, often for focus styles. Doesn’t affect layout.

Question 4

What’s the `accent-color` property?

Accepted Answer

It styles form controls like checkboxes or radio buttons with a custom color. Easy accessibility win.

Question 5

What are CSS custom properties?

Accepted Answer

Custom properties (e.g., `--color: blue`) are variables you define and reuse with `var()`. They’re great for theming and keeping code DRY.

Question 6

How do you style the first letter of a paragraph?

Accepted Answer

Use the `::first-letter` pseudo-element to target and style it—like making it big or bold.

Question 7

What’s the `transform` property?

Accepted Answer

It lets you rotate, scale, or move elements—like `transform: rotate(45deg)`. Smooth and hardware-accelerated.

Question 8

What’s the `overflow` property?

Accepted Answer

It handles content that spills out—like `scroll` for scrollbars or `hidden` to clip it.

Question 9

What’s the `minmax()` function in Grid?

Accepted Answer

It sets a range for grid tracks—like `minmax(100px, 1fr)` for a flexible column. Balances control and flexibility.

Question 10

What’s the `:not()` selector?

Accepted Answer

It targets everything except what’s in the parentheses—like `:not(.disabled)` styles all but disabled elements.

DeVlt

Technical Css Interview Questions