Block & Inline Element and How to Change

Let’s say you are having problems with website texts which you want to see in the next line, or you want to see in the same line. But somehow it’s not happening. Then probably you are mixing up the block element with the inline element. These are two types of elements in HTML, and both of these types have multiple HTML tags in their group.

Block elements are those that take the whole width of a line and do not let any other element sit on this block. For example, think of it as bricks. Every other element will be on top or bottom of this block element. The most common block elements are <div> and <p>. For these tags, it takes the whole width of the screen. Even if the text doesn’t fill up the whole width, it will take the space.

And for inline elements, they can sit side by side. They only take the necessary width they require. Think of it like Lego. You can place them side by side. The most common inline element is <a>.