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.