Bubble CSS: Replace relative positioning trickery with a margin

chrome/browser/resources/shared/css/bubble.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. */
 
 .bubble {
   position: absolute;
   white-space: normal;
   /* Height is dynamic, width fixed. */
   width: 300px;
   z-index: 9999;
 }
 
 .bubble-content {
   color: black;
-  left: 1px;
   line-height: 150%;
+  margin: 1px;
   padding: 8px 11px 12px;
   position: relative;
-  right: 1px;
-  top: 1px;
-  width: 298px;
   z-index: 3;
 }
 
 /* When the close button is there, we need more padding on the right of the
  * bubble. */
 .bubble-close:not([hidden]) ~ .bubble-content {
   -webkit-padding-end: 22px;
 }
 
 .bubble-close {
@@ skipping 27 matching lines @@
 
 .bubble-close:active {
   background-image: -webkit-image-set(
     url('../../../../../ui/resources/default_100_percent/close_bar_pressed.png')
         1x,
     url('../../../../../ui/resources/default_200_percent/close_bar_pressed.png')
         2x);
 }
 
 .bubble-shadow {
-  bottom: -2px;
+  bottom: 0;
   box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
   left: 0;
   position: absolute;
   right: 0;
   top: 0;
   z-index: 1;
 }
 
 .bubble-arrow {
   -webkit-transform: rotate(45deg);
@@ skipping 16 matching lines @@
 
 .bubble-shadow,
 .bubble-content {
   border-radius: 6px;
   box-sizing: border-box;
 }
 
 .auto-close-bubble {
   position: fixed;
 }