Angular Material's responsive CSS layout is built on flexbox.
The layout system is based upon element attributes rather than CSS classes.
Attributes provide an easy way to set a value (eg layout="row"
), and additionally
helps us separate concerns: attributes define layout, and classes define styling.
Use the layout
attribute on an element to arrange its children
horizontally in a row (layout="row"
), or vertically in
a column (layout="column"
).
See Layout Options for information on responsive layouts and other options.