docs: fix form field example styles (#21124)

* Fixes an example that was referring to the `example-container` class, but wasn't actually using it.
* Uses flexbox to layout the example, instead of `br` tags which are an anti-pattern.

Fixes angular/material.angular.io#889.

(cherry picked from commit 154ef43)

Author: crisbeto

src/components-examples/material/form-field/form-field-overview/form-field-overview-example.css

@@ -0,0 +1,5 @@
+:host {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+}

src/components-examples/material/form-field/form-field-overview/form-field-overview-example.html

@@ -1,18 +1,15 @@
-<div class="example-container">
-  <mat-form-field appearance="fill">
-    <mat-label>Input</mat-label>
-    <input matInput>
-  </mat-form-field>
-  <br>
-  <mat-form-field appearance="fill">
-    <mat-label>Select</mat-label>
-    <mat-select>
-      <mat-option value="option">Option</mat-option>
-    </mat-select>
-  </mat-form-field>
-  <br>
-  <mat-form-field appearance="fill">
-    <mat-label>Textarea</mat-label>
-    <textarea matInput></textarea>
-  </mat-form-field>
-</div>
+<mat-form-field appearance="fill">
+  <mat-label>Input</mat-label>
+  <input matInput>
+</mat-form-field>
+<mat-form-field appearance="fill">
+  <mat-label>Select</mat-label>
+  <mat-select>
+    <mat-option value="one">First option</mat-option>
+    <mat-option value="two">Second option</mat-option>
+  </mat-select>
+</mat-form-field>
+<mat-form-field appearance="fill">
+  <mat-label>Textarea</mat-label>
+  <textarea matInput></textarea>
+</mat-form-field>

src/components-examples/material/form-field/form-field-overview/form-field-overview-example.ts

@@ -4,5 +4,6 @@ import {Component} from '@angular/core';
 @Component({
   selector: 'form-field-overview-example',
   templateUrl: 'form-field-overview-example.html',
+  styleUrls: ['form-field-overview-example.css']
 })
 export class FormFieldOverviewExample {}