What is the difference between inline, block, and inline-block elements?

There are the following differences between inline, block, and inline-block elements: Inline elements: These take only as much width as their content and stay in the same line. For example,<span>, <a>, <strong> Block elements: These occupy the full width of their container and start on a new line. For example, <div>, <p>, <h1> Inline-block elements: These stay on the same line like inline elements but allow setting width and height. For example, <button>, <img>, <input>