2

Started exploring Angular 4 last night and I was just wondering if there is a way to make the mat-grid-list material design component responsive as easy as how Boostrap handles it?

Anyone? Thank you in advanced.

Improve this question
5
  • grid-list is already responsive; the height/width of each tile is dynamic based on the screen ratio. if you want the number of cols/rows to be dynamic, that is easily controlled in CSS. Commented Oct 12, 2017 at 3:14
  • As @Claies, mat-grid-list is already responsive. In case you want change cols value, you can write the code to detect screen size and set column number based on that. Commented Oct 12, 2017 at 3:30
  • Thanks for the reply. Angular 4 just seems to resize the entire grid list and no way to react to something similar to Boostrap's col-xs-12, col-md-6, etc. Commented Oct 12, 2017 at 4:30
  • 1
    I'm looking for the "cascading": effect of columns. Angular 4 and Material 2 only shrinks them which is really weird. Commented Oct 12, 2017 at 9:35
  • 1
    this is the answer Greetings :) Commented Nov 3, 2017 at 17:43

1 Answer 1

Reset to default
3

Not in pure html, you could find some html/ts solution though, something like this

If you want to achieve this only with html, take a look at the Angular Flex Layout framework instead of mat-grid-list.

Improve this answer
Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.