[MD settings] remove label float from dropdowns so that they center correctly

chrome/browser/resources/settings/search_page/search_page.html

 <link rel="import" href="chrome://resources/html/polymer.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/neon-animation/neon-animatable.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-button/paper-button.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-dropdown-menu/paper-dropdown-menu.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-listbox/paper-listbox.html">
 <link rel="import" href="/route.html">
 <link rel="import" href="/search_engines_page/search_engines_page.html">
 <link rel="import" href="/search_engines_page/search_engines_browser_proxy.html">
 <link rel="import" href="/settings_page/settings_animated_pages.html">
 <link rel="import" href="/settings_page/settings_subpage.html">
 <link rel="import" href="/settings_shared_css.html">
 
 <dom-module id="settings-search-page">
   <template>
     <style include="settings-shared">
     </style>
     <settings-animated-pages id="pages" current-route="{{currentRoute}}"
         section="search">
       <neon-animatable id="main">
         <div class="settings-box first">
           <p class="start">$i18n{searchExplanation}</p>
-          <paper-dropdown-menu vertical-align="auto">
+          <paper-dropdown-menu vertical-align="auto" no-label-float>

[stevenjb, 2016/07/29 16:21:08]

I am wondering if we could do something like this in the shared CSS so that we
do not need to add this everywhere (values copied from
paper-dropdown-menu-light.html):

paper-dropdown-menu {
  --paper-dropdown-menu-input {
    padding-top: 0;
  }
  --paper-dropdown-menu-label {
    top: 8px;
  }
  --paper-dropdown-menu-icon {
    margin-top: 0px;
  }
}

The disadvantage is that we would have to maintain that styling. Also, there are
a couple of CSS rules that do not have associated CSS vars; I don't think they
will matter, but they might?

+michaelpg@, WDYT?

[michaelpg, 2016/07/29 17:40:36]

seems like no-label-float does a variety of magical[1] things including
affecting the ripple[2] and things dependent on state[3][4].

[1]
https://github.com/PolymerElements/paper-dropdown-menu/blob/master/paper-drop...
[2]
https://github.com/PolymerElements/paper-dropdown-menu/blob/master/paper-drop...
[3]
https://github.com/PolymerElements/paper-input/blob/master/paper-input-contai...
[4]
https://github.com/PolymerElements/paper-input/blob/master/paper-input-contai...

so... if we don't use a label, no-label-float seems worthwhile.

[stevenjb, 2016/07/29 17:45:34]

OK. Wish there were a way to change the default. Oh well.

             <paper-listbox class="dropdown-content"
                 selected="[[getSelectedSearchEngineIndex_(searchEngines_)]]"
                 on-iron-select="onIronSelect_">
               <template is="dom-repeat" items="[[searchEngines_]]">
                 <button class="dropdown-item" role="option">
                   [[item.name]]
                 </button>
               </template>
             </paper-listbox>
           </paper-dropdown-menu>
         </div>
         <div class="settings-box">
           <paper-button on-tap="onManageSearchEnginesTap_"
               class="primary-button">
             $i18n{searchEnginesManage}
           </paper-button>
         </div>
       </neon-animatable>
       <template is="dom-if" name="search-engines">
         <settings-subpage page-title="$i18n{searchEnginesManage}">
           <settings-search-engines-page></settings-search-engines-page>
         </settings-subpage>
       </template>
     </settings-animated-pages>
   </template>
   <script src="search_page.js"></script>
 </dom-module>