grid list's md-row-height="fit" results in tile height being 0 even even when md-grid-list has height

[richtier]

I'm having problems making "fit" work for md-row-height on md-grid-list: when I set "fit" the tiles all have height of 0, resulting in the grid list not displaying.

Simplest way to reproduce is to copy the "Responsive Usage" from the docs.

<style>

md-grid-list {
  height: 500px;
}

</style>

<div
  ng-controller="ribbon.main"
  class="question-deck"
  style="padding-bottom:80px;">
        <md-content
          style="padding: 0; background: transparent;"
          class="md-padding">
            <md-grid-list
                md-cols-gt-md="12" 
                md-cols-sm="3"
                md-cols-md="8"
                md-row-height="fit"
                md-gutter-gt-md="16px"
                md-gutter-gt-sm="8px" 
                md-gutter="4px">
              <md-grid-tile
                  ng-repeat="tile in colorTiles"
                  ng-style="{
                    'background': tile.color
                  }"
                  md-colspan-gt-sm="{{tile.colspan}}"
                  md-rowspan-gt-sm="{{tile.rowspan}}">
              </md-grid-tile>
            </md-grid-list>
        </md-content>
</div>

When I change md-row-height="1:1" then the grid tiles are >0 which is nice, but the fit is not as desired.

I see in other closed issues we should set the list height, but as you can see that did not solve for me.

[Tetraib]

+1 For that. I ended up using 50% or 33% ... (49,9% or 32.8%....) for md-row-height but it is not very neat. Any better workaround ?

[shyndman]

I can take this on, unless Ryan is taking on the remaining grid bugs.

[rschmukler]

@shyndman Feel free to have at it! Kick it back my way if you end up not having time.

[Splaktar]

I was able to reproduce this as well. Have a CodePen handy if needed.

[tony0918]

+1

[simongcc]

+1

[obie]

bump

[vasiliy0s]

+1