The display property is being used for showing, hiding, or positioning HTML elements in our layout. Every HTML element has a default display behavior and without understanding the logic behind it, you will have difficulties while working with CSS.
There is also a newer option of the display property called flex, which we use for building Flexbox layouts, and flex also provides an easier way for positioning elements. So in this post, you’re going to learn:
- What block & inline-level elements are
- Why using inline-block is good
- The flex property as an alternative
- Flex vs Inline-Flex
- How to center things easily with Flex
Block-Level Elements
Every HTML element has a default display behavior. Some HTML elements (like
,
,
- etc.) have a default display behavior which is known as block-level.
Block-level means that once they’re placed in the template, they will take each the full-width of a complete row.
#web-design #flexbox #css #display #block #flex
1.90 GEEK