Angular Material Grid Layout


Answer :

I'll give you the basics.

In Angular Material (for Angular 2/4) the most commonly used attributes are:

fxLayout="row | column" fxLayoutAlign="start | center | end | stretch | space-around | space-between | none" (can accept 2 properties at the same time) fxFlex="number" (can accept numbers from 1 to 100) 

You can also use postfix as fxLayout.xs and so on to apply rules only for specific resolution.

For more info you can look through the docs: https://github.com/angular/flex-layout/wiki/API-Documentation

To play around with alignment, you can use the demonstration from Angularjs Material resource (it's totally the same as for Angular Material for Angular 2/4): https://material.angularjs.org/latest/layout/alignment

enter image description here

And another one useful link: https://tburleson-layouts-demos.firebaseapp.com/#/docs


Comments

Popular posts from this blog

Converting A String To Int In Groovy

"Cannot Create Cache Directory /home//.composer/cache/repo/https---packagist.org/, Or Directory Is Not Writable. Proceeding Without Cache"

Android How Can I Convert A String To A Editable