[CUPS] Implement the UI handler for adding a new printer.

chrome/browser/resources/settings/printing_page/cups_printers.html

 <link rel="import" href="chrome://resources/html/polymer.html">
 <link rel="import" href="/printing_page/cups_add_printer_dialog.html">
 <link rel="import" href="/printing_page/cups_printers_list.html">
 <link rel="import" href="/settings_shared_css.html">
 
 <dom-module id="settings-cups-printers">
   <template>
     <style include="settings-shared">
       a[is='action-link'] {
         display: inline-block;
         text-decoration: none;
       }
 
       a[is='action-link']:hover {
         color: blue;
         text-decoration: underline;
       }
+      
+      #message {
+        display: flex;
+        justify-content: center;
+        position: absolute;
+        top: 85%;
+        width: 100%;
+      }
+
+      .center {
+        background-color: black;
+        color: white;
+        font: 13px;
+        padding-bottom: 15px;
+        padding-top: 15px;
+        text-align: center;
+        width: 350px;
+      }
     </style>
 
     <div class="settings-box first">
       <a is="action-link" on-tap="onAddPrinterTap_" actionable>
         $i18n{addCupsPrinter}
       </a>
     </div>
 
     <settings-cups-add-printer-dialog id="addPrinterDialog">
     </settings-cups-add-printer-dialog>
 
     <settings-cups-printers-list printers="{{printers}}"
         search-term="[[searchTerm]]">
     </settings-cups-printers-list>
+
+    <div id="message">

[xdai1, 2016/09/22 18:22:11]

Modified it as you suggested. Now the rectangle is centered horizontally at any
width. Thanks!

+      <div class="center" id="addPrinterMessage" hidden>
+        $i18n{printerAddedSuccessfulMessage}
+      </div>
+    </div>
   </template>
   <script src="cups_printers.js"></script>
 </dom-module>