[DevTools] Make UI.GlassPane position contentElement for different overlay controls.

third_party/WebKit/Source/devtools/front_end/ui/suggestBox.css

 /*
  * Copyright (C) 2011 Google Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions are
  * met:
  *
  *     * Redistributions of source code must retain the above copyright
  * notice, this list of conditions and the following disclaimer.
  *     * Redistributions in binary form must reproduce the above
@@ skipping 11 matching lines @@
  * OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
  * SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
  * LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
  * DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
  * THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
  * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
  * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  */
 
 :host {
-    position: absolute;
-    background-color: transparent;
-    z-index: 1000;
-    pointer-events: none;
-    overflow: hidden;
     display: flex;
-    flex-direction: row;
-}
-
-.suggest-box-left-spacer {
-    flex: 0 1 auto;
-}
-
-.suggest-box-horizontal {
-    display: flex;
-    flex-direction: column;
-    flex: 0 0 auto;
-    max-width: 300px;
-}
-
-.suggest-box-top-spacer {
     flex: auto;
 }
 
-:host(.under-anchor) .suggest-box-top-spacer,
-:host(:not(.under-anchor)) .suggest-box-bottom-spacer {
-    flex: 0 0 auto;
-}
-
-.suggest-box-container {
-    display: flex;
-    flex-direction: row;
-}
-
 .suggest-box {
+    flex: auto;
     background-color: #FFFFFF;
     pointer-events: auto;
     margin-left: -3px;
     box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05),
                 0 2px 4px rgba(0, 0, 0, 0.2),
                 0 2px 6px rgba(0, 0, 0, 0.1);
     overflow-x: hidden;
 }
 
-.suggest-box .suggest-box-content-item {
-    padding: 1px;
+.suggest-box-content-item {
+    padding: 1px 0 1px 1px;
     margin: 0;
     border: 1px solid transparent;
-    padding-right: 0;
     white-space: nowrap;
     display: flex;
 }
 
-.suggest-box .suggest-box-content-item.secondary {
+.suggest-box-content-item.secondary {
     background-color: #f9f9f9;
 }
 
 .suggestion-title {
     overflow: hidden;
     text-overflow: ellipsis;
 }
 
 .suggestion-subtitle {
     flex: auto;
     text-align: right;
     color: #999;
     margin-right: 3px;
     overflow: hidden;
     text-overflow: ellipsis;
 }
 
 .suggestion-icon {
     user-select: none;
     align-self: center;
     flex-shrink: 0;
 }
 
-.suggest-box .suggest-box-content-item .query {
+.suggest-box-content-item .query {
     font-weight: bold;
 }
 
-.suggest-box .suggest-box-content-item .spacer {
+.suggest-box-content-item .spacer {
     display: inline-block;
     width: 20px;
 }
 
-.suggest-box .suggest-box-content-item.selected {
+.suggest-box-content-item.selected {
     background-color: rgb(56, 121, 217);
 }
 
-.suggest-box .suggest-box-content-item.selected > span {
+.suggest-box-content-item.selected > span {
     color: #FFF;
 }
 
-.suggest-box .suggest-box-content-item:hover:not(.selected) {
+.suggest-box-content-item:hover:not(.selected) {
     background-color: rgba(56, 121, 217, 0.1);
 }