Clip long host names.

remoting/webapp/base/html/main.css

 /* Copyright (c) 2012 The Chromium Authors. All rights reserved.
  * Use of this source code is governed by a BSD-style license that can be
  * found in the LICENSE file.
  */
 
 html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p,
 blockquote, a, abbr, acronym, address, big, cite, code, del, dfn, em,
 font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl,
 dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody,
 tfoot, thead, tr, th, td, button {
@@ skipping 491 matching lines @@
 }
 
 .host-list-remove-icon:hover {
   opacity: 0.5 !important;
 }
 
 .host-list-edit {
   padding: 0 5px;
 }
 
+.host-list-clip {
+  overflow-x: hidden;

[kelvinp, 2015/12/04 20:12:20]

Do you want 

white-space: nowrap;
text-overflow: ellipsis;

as well to show ... when the host name is too long?

[Jamie, 2015/12/05 21:15:28]

I've added an ellipsis, but I want to keep word wrap, otherwise the last-online
text is lost (with word wrap it falls on a separate line). I might be able to
make this work by putting that information in a separate <span> so that only the
name is truncated, which would have the advantage that each host is a consistent
height, even if the name is very long. The downside is that most people who set
a very long hostname will include spaces, so we'd be hiding part of the name
that is currently visible, albeit on a different line. I don't think that's the
right trade-off.

+}
+
 .host-name-label, .host-name-label:visited, .host-name-label:active {
   color: inherit;
   cursor: inherit;
 }
 
 .host-list-main-icon {
   margin-__MSG_@@bidi_end_edge__: 10px;
   vertical-align: middle;
   position: relative;
 }
@@ skipping 262 matching lines @@
   color: gray;
   margin-top: -10px;
   margin-bottom: 10px;
   font-size: 80%;
 }
 
 body:not(.os-windows) .windows-only,
 body:not(.os-mac) .mac-only {
   display: none;
 }