Material-card too wide for usage in flex grid system

[Frank3K]

I would expect that three <material-card flex=33>'s could be stacked horizontally in a <material-content layout="horizontal">-container. Unfortunately this makes the page too wide (i.e. wider than the window width).

As far as I can see this is the result of the rule margin: $card-margin; for material-card (in _card.scss), where $card-margin is currently 10px (in _variables.scss). Setting the margin to 0 is no option layout-wise; the card is hardly recognizable then.

Example plunkr: http://plnkr.co/edit/vHckwcMApTIcRev5KF9e

[ajoslin]

Fixed. It will fit in fine now - the problem was the inner image's css sizing the image wrong.

[Frank3K]

Unfortunately I don't think it's fixed. I've updated the plunkr to the currently latest version (v0.0.2-master-a69ac48).

The problem still persists: the material-card itself (still) has a margin which leads to the problem.

Due to the change (f33185f) the image inside the material-card looks different now. Previously it filled the whole width of the card, as can be seen in the plunkr from three days ago.

[Frank3K]

@ajoslin: This isssue was reintroduced in a2bc3c6. Should I open a new issue for that (since I can not re-open this one). Updated plunkr.