Inline-block element use cases

[kirupa]

@sephorus

What do they mean by block-direction? Elements that have display: block; are ordered from top to bottom, so does this just mean the margin-top and margin-bottom of inline elements are ignored?

That is correct about the block-direction. In languages like English where characters flow horizontally, the margin-top and margin-bottom on inline elements are ignored. The margin-left and margin-right properties will work.

@sephorus

For the second statement, does the padding of the inline element get calculated when determining the height of the element, but ignored by the parent

No, the height of the element doesn’t contain the padding values. Visually we can see it, but the actual height calculation (like via getComputedStyle) will just return auto.

Great questions!