How can make the md-tabs length take all parent length - angularjs

Question

I have the following tabs inside my project but my problem that the tabs is not cover all the space
<fieldset class="form-group userEditGrid" ng-if="proj.checkEditProjectPanelCriteria(proj.selectionRow)" style="top:42%; height: 55%; !important">
<legend style="color:#d77509;font-weight:bold; border:0px; width:10%;" > {{proj.getMode()}}</legend>
<div ng-cloak="" class="tabsdemoDynamicHeight">
<md-content>
<md-tabs md-dynamic-height="" md-border-bottom="" md-selected="proj.selectedLevelTabs" >
<md-tab label="General Information" ng-disabled = "proj.isFireProtectionPanelOpen() || proj.isAddDocumentPanelOpen()">
<form name="editForm">
<md-content class="md-padding">
<div class="row" disable-all = "proj.ViewMode == 1">
<div class="row">
<div class="col-sm-2" ng-class="{ 'has-error': editForm.projanyname.$dirty && editForm.projectname.$error.required }">
<md-input-container class="md-block" >
<label for="projectname">Project Name *</label>
<input type="text" name="projectname" id="projectname" class="form-control" ng-model="proj.copyProjectRow.projectName" required="">
<span ng-show="editForm.projectname.$dirty && editForm.projectname.$error.required" class="help-block">project name is required</span>
</md-input-container>
</div>
</div>
</div>
</md-content>
</form>
</md-tab>
<md-tab>
<md-content class="md-padding">
<div class="row">
<jsp:include page="levels/level1.jsp" />
</div>
</md-content>
</md-tab>
</md-tabs>
</md-content>
</div>
</fieldset>
How can I make the length of the tabs take up all the space?
NOTE: I call this file form other jsp file
<div>
<jsp:include page="editProject.jsp" />
</div>

Answer 1

This is how I do to fill 100% height of the md-tab body:
First of all we need to create a CSS class to make first child of md-tab-content 100% height:
md-tab-content > div {
height: 100%;
}
Then the structure of a tab must be like this:
<md-tab>
<md-tab-label>Tab title label</md-tab-label>
<md-tab-body>
<div layout-fill layout="column">
<p>This will be full height</p>
</div>
</md-tab-body>
</md-tab>
Note that we must use layout-fill on the container inside <md-tab-body> to make it grow with 100% height. If we need to have more children layouts inside our container we must use layout="column"to make them grow vertically and use flexattributes as we need our layout structure.
I hope this solve your problem! It's probably impossible to make md-tab-bodycontent grow only using flex and not using CSS classes.