CSS Layout - inline-block
The inline-block Value
It has been possible for a long time to create a grid of boxes that fills the
browser width and wraps nicely (when the browser is resized), by using the
inline-block value of the
property makes this even easier.
inline-block elements are like inline elements but they can have a width and a height.
The old way - using
float (notice that we also need to specify a
clear property for the element after the floating boxes):
border: 3px solid blue;
The same effect can be achieved by using the
display property (notice that no
clear property is needed):
border: 3px solid pink;