This repository was archived by the owner on Sep 5, 2024. It is now read-only.
This repository was archived by the owner on Sep 5, 2024. It is now read-only.
Nested layout-fill does not fill container #2834
Description
Suppose we have a structure like the following. body is set to be 100% of the screen height.
#div1 has the height equal to body less md-toolbar which is correct since the outter-most div's layout-fill works as expected and takes up 100%.. However, I would expect md-content to have the same height as #div1 because it has a layout-fill but it does not.
<body>
<div layout="column" layout-fill>
<md-toolbar>
<h1 class="md-toolbar-tools" layout-align-gt-sm="center">Hello World</h1>
</md-toolbar>
<div flex id="div1">
<md-content layout="row" layout-align="center center" layout-fill>
This container is not filling the parent height
</md-content>
</div>
</div>
</body>
Example:
http://codepen.io/anon/pen/qdZbNP