WebUI: dialog close button should have fixed 4px top margin

ui/webui/resources/cr_elements/cr_dialog/cr_dialog.html

 <link rel="import" href="chrome://resources/cr_elements/icons.html">
 <link rel="import" href="chrome://resources/html/assert.html">
 <link rel="import" href="chrome://resources/html/polymer.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper-icon-button.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-styles/default-theme.html">
 
 <dom-module id="cr-dialog">
   <template>
     <style>
       :host {
@@ skipping 66 matching lines @@
       }
 
       .body-container {
         display: flex;
         flex-direction: column;
         overflow: auto;
         @apply(--cr-dialog-body-container);
       }
 
       .top-container {
-        align-items: center;
+        align-items: flex-start;

[dschuyler, 2017/04/18 22:58:47]

I tried a quick look through things that add content to title (line 115) using
this search:

https://cs.chromium.org/search/?q=file:resources/settings+class%3D%5C%22%5B%5...

Most look like they are text labels. Please help me look through the search
above (maybe check that my search is valid) or otherwise help us know that this
align change doesn't cause an issue.

Thanks!

         display: flex;
         min-height: 47px;
       }
 
       .title-container {
         display: flex;
         flex: 1;
         outline: none;
       }
 
       #close {
         --paper-icon-button: {
           height: 36px;
           width: 36px;
         };
 
         --layout-inline: {
           display: flex;
         };
 
         -webkit-margin-end: 4px;
+        margin-top: 4px;
         padding: 10px;  /* Makes the actual icon 16x16. */
       }
     </style>
     <div class="top-container">
       <div class="title-container" tabindex="-1">
         <content select=".title"></content>
       </div>
       <paper-icon-button icon="cr:clear" on-tap="cancel" id="close"
           aria-label$="[[closeText]]">
       </paper-icon-button>
     </div>
     <div class="body-container">
       <span id="bodyTopMarker"></span>
       <content select=".body"></content>
       <span id="bodyBottomMarker"></span>
     </div>
     <content select=".button-container"></content>
     <content select=".footer"></content>
   </template>
   <script src="cr_dialog.js"></script>
 </dom-module>