Change destination selection layout to accomodate for bigger font sizes.

BUG=421393

Review URL: https://codereview.chromium.org/660733006

Cr-Commit-Position: refs/heads/master@{#300037}

chrome/browser/resources/print_preview/settings/destination_settings.css

@@ -16,7 +16,7 @@
 #destination-settings .destination-settings-box {
   -webkit-box-align: center;
   display: -webkit-box;
-  height: 28px;
+  min-height: 28px;
 }
 
 .destination-settings-box.stale {
@@ -36,17 +36,11 @@
 
 .destination-settings-info-wrapper {
   -webkit-box-flex: 1;
-  height: 28px;
-  position: relative;
 }
 
 .destination-settings-info {
-  -webkit-box-orient: vertical;
-  -webkit-box-pack: center;
-  display: -webkit-box;
-  height: 100%;
-  position: absolute;
-  white-space: nowrap;
+  display: table;
+  table-layout: fixed;
   width: 100%;
 }
 
@@ -56,7 +50,7 @@
 }
 
 .throbber-container .throbber {
-   -webkit-margin-end: 8px;
+  -webkit-margin-end: 8px;
 }
 
 .destination-throbber-name-container {
@@ -64,23 +58,30 @@
   -webkit-box-orient: vertical;
   -webkit-box-pack: center;
   display: -webkit-box;
-  height: 28px;
+  min-height: 28px;
 }
 
-.destination-settings-name,
 .destination-throbber-name {
   font-size: 110%;
   overflow: hidden;
   text-overflow: ellipsis;
 }
 
-.destination-settings-location {
-  opacity: 0.4;
-  overflow: hidden;
-  text-overflow: ellipsis;
+.destination-settings-info > div {
+  display: table-row;
 }
 
-.destination-settings-offline-status {
+.destination-settings-info > div > div {
+  display: table-cell;
   overflow: hidden;
   text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.destination-settings-name {
+  font-size: 110%;
+}
+
+.destination-settings-location {
+  opacity: 0.4;
 }

chrome/browser/resources/print_preview/settings/destination_settings.html

@@ -13,9 +13,9 @@
       <img class="destination-settings-icon">
       <div class="destination-settings-info-wrapper">
         <div class="destination-settings-info">
-          <div class="destination-settings-name"></div>
-          <div class="destination-settings-location"></div>
-          <div class="destination-settings-offline-status"></div>
+          <div><div class="destination-settings-name"></div></div>
+          <div><div class="destination-settings-location"></div></div>
+          <div><div class="destination-settings-offline-status"></div></div>
         </div>
       </div>
     </div>