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

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 2

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.

Question 3

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 4

What’s the `overflow` property?

Accepted Answer

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

Question 5

How do you create a CSS circle?

Accepted Answer

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

Question 6

How do you make text unselectable?

Accepted Answer

Use `user-select: none` to prevent users from highlighting text. Handy for buttons or UI elements.

Question 7

What’s the `text-align` property?

Accepted Answer

It aligns text horizontally—like `center`, `left`, or `justify`. Basic but essential.

Question 8

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 9

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 10

What does `display: none` do?

Accepted Answer

It completely hides an element and removes it from the layout—no space reserved. Different from `visibility: hidden`, which just makes it invisible but keeps the space.

DeVlt

Easy Interview Questions

Why Practice Easy Questions?

Browse Easy Questions by Category

Easy Interview Preparation Tips

Study Strategy

Interview Day

DeVlt