Q: What’s the difference between `inline` and `block` elements?

Inline elements (like ` `) sit in a line and don’t break the flow, while block elements (like ` `) take up the full width and start on a new line. It’s about layout behavior.

Question 1

How do `relative` and `absolute` positioning differ?

Accepted Answer

Relative moves an element from its original spot but keeps its space in the flow. Absolute pulls it out of the flow, positioning it relative to its nearest positioned ancestor. Big difference in layout impact!

Question 2

What’s the difference between `inline` and `block` elements?

Accepted Answer

Inline elements (like ``) sit in a line and don’t break the flow, while block elements (like `

`) take up the full width and start on a new line. It’s about layout behavior.

Question 3

How do you create a CSS circle?

Accepted Answer

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

Question 4

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 5

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 6

What’s the difference between `margin` and `padding`?

Accepted Answer

Padding is space inside an element’s border, while margin is space outside it. Padding affects the content area, margin affects spacing between elements.

Question 7

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 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 is the box model in CSS?

Accepted Answer

The box model is how CSS sees every element as a rectangular box, made up of content, padding, borders, and margins. It’s the foundation of layout design—everything’s a box!

Question 10

What’s the purpose of the `float` property?

Accepted Answer

Float pulls an element to the left or right, letting content wrap around it. It’s old-school but still used for things like text around images.

DeVlt

Easy Css Interview Questions

Unlock All Interview Questions

Why Practice Easy Css Questions?

DeVlt