How to make <img> and <md-card> responsive in angular Material? How to make <img> and <md-card> responsive in angular Material? angularjs angularjs

How to make <img> and <md-card> responsive in angular Material?


This may help your cause.
http://codepen.io/sstorie/pen/myJWxQThe key is those two classes added to the parent and the img in each card

.parent {  overflow: hidden;}.card img {  width: 100%;  height: auto;}


You can use the flex(width for row, height for column) attribute to declare md-card size and layout-wrap on the parent container. Layout-align might help your cause as well.

<div layout="row" layout-margin layout-wrap layout-align="center center">     <md-card flex="25"> //25% of parent                //content      </md-card></div>

Check out the documentation for more options.