Display Types

CSS Display Property

The display property controls how an element participates in layout:

block — full width, starts on new line (div, p, h1)

display: block;

inline — width/height ignored, flows with text (span, a, strong)

display: inline;

inline-block — flows with text but respects width/height:

display: inline-block;
width: 100px;
height: 50px;

none — hides the element completely (no space reserved):

display: none;

visibility: hidden — hides but keeps space:

visibility: hidden;

Your Task

Create elements demonstrating block, inline, inline-block, and none display values.