What is the difference between inline, block, and inline-block display values?

Answer

block: the element starts on a new line and stretches to fill the full container width. Width, height, margin, and padding all work as expected. Examples: <div>, <p>, <h1>. inline: the element flows within text, only taking as much width as needed. Vertical margin/padding is ignored; width and height have no effect. Examples: <span>, <a>, <strong>. inline-block: like inline, it flows within text without starting a new line, but unlike inline, it respects width, height, and all margin/padding values. Useful for creating horizontal navigation buttons or grid-like items without Flexbox.