angular-material2

I'm using an md-table in an Angular 4 app since I'm using Material for other parts of the UI formatting. When I use a regular table with basically no CSS, the columns auto-format to fit the widest td element. With md-table, the columns are all set to the same width divided into the total table width, except for cells that are too wide and then it extends the cell and pushes the other cells in that row to the right. My regular table: <md-tab label="Data" > <md-card class="datacard"> <md-card-content> <div> <table class="datatable"> .... </table> </div> </md-card-content> </md-card> </md-tab>

I'm starting a project with angular material. Does it have a native system for positioning elements in a responive grid like bootstrap does ? Otherwise is it ok practice to combine material design with bootstrap for the grid system ? Maybe I am taking the wrong aproach to the problem. If you are using Material2, you can use Angular Flex Layout for responsiveness. It compliments Angular2 well and is lightweight. Basically Material2 + Flex-layout is equivalent to Bootsrap library. Here's an example of how flex-layout can be used for grid system/responsiveness with Angular/Material2. Sample Code

import { MdAutocomplete } from '@angular/material'; @Component({ template:' <input type="text" [mdAutocomplete]="auto"/> <md-autocomplete #auto="mdAutocomplete" #autoComplete> <md-option> Some Options </md-option> </md-autocomplete>' }) export class AutoComplete { @ViewChild('autoComplete') autoComplete: MdAutocomplete; closeAuto() { this.autoComplete.closePanel(); } } It is not the complete code but the idea is to call closePanel inside a method. closePanel is listed as a method on https://material.angular.io/components/autocomplete/api but it fails to work. It says method not found. tried

I currently have a textarea like this: <textarea matInput rows="5" cols="40" placeholder="text"></textarea> However, it is always the same size. Any idea on how to change the size of the textarea ? Here's an example : <mat-form-field> <mat-label>Description</mat-label> <textarea matInput formControlName="description" matTextareaAutosize matAutosizeMinRows=1 matAutosizeMaxRows=5></textarea> </mat-form-field> Reference: https://material.angular.io/components/input/api Depending on what you've meant by: However, it is always the same size. There are two options. OPTION 1 (STATIC size depending on