HTML/CSSBeginner#css#display

Explain the different values of the display property.

block starts on a new line and fills width (div, p). inline flows within text and ignores width/height (span, a). inline-block flows inline but respects width/height/margin. none removes the element from layout entirely (still in DOM).

Example
span { display: inline-block; width: 100px; height: 40px; }
.hidden { display: none; }

Related Questions

1
HTML/CSSBeginner#css#display

What is the difference between visibility: hidden and display: none?

Open
2
HTML/CSSIntermediate#css#position

Explain the CSS position property values.

Open
3
HTML/CSSIntermediate#css#position

How does position: sticky work?

Open