Display: inline

I am an inline box
Another inline box
Span A Span B

Display: inline-block

I am an inline-block box
Another inline-block box

Display: block

I am a block box
Another block box

Display: none

You can't see me (display: none)
Neither can you see me

Visibility: hidden

I’m hidden but I take up space
Another invisible box

🧼 Where is display: none?

This element is not rendered at all in the layout — it’s like it's not even in the code.

🫥 Where is visibility: hidden?

This element exists in layout but is just invisible — it still takes space on the page.