Block Utilities

Sometimes you need to override an element’s native block or inline-block behavior.

.block – makes any element behave as a block element.

This is a <span> element (normally an inline element).

.inline-block – makes any element behave as an inline-block element.

This is a <div> element (normally a block element).

Remember that CSS flexbox and CSS grid control the behavior of their immediate child elements. So, if you are trying to use .block or .inline-block on an immediate child of .container, .flex or .grid, it won’t work.