WebUI "Edit Search Engine" Dialog now wider and deeper and buttons bottom justified

chrome/browser/resources/edit_search_engine_dialog.css

 /* Copyright (c) 2011 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 {
   height: 100%;
   margin: 0;
   overflow: hidden;
 }
@@ skipping 16 matching lines @@
 
 #top-box {
   padding: 9px 9px 0 9px;
 }
 
 #middle-box {
   padding: 4px 9px 0 9px;
 }
 
 .action-area {
-  -webkit-box-align: center;
-  -webkit-box-orient: horizontal;
-  -webkit-box-pack: end;
-  display: -webkit-box;
+  bottom: 0;
   padding: 12px;
-  text-align: end;
+  position: absolute;

[Rick Byers, 2011/11/29 22:06:47]

I believe the use of webkit-box here was to get the two buttons to be the same
size - both big enough to fit the longer of the two text strings inside them
(regardless of language).  See the comments on the original CL here:
http://codereview.chromium.org/8118012/

It seems like we make an effort to do this elsewhere too (eg. all the buttons on
the options page - see
http://codesearch.google.com/#OAMlx_jo-ck/src/chrome/browser/resources/option...)
so I assume we want to preserve it here too.

It's also nice that using -webkit-box-pack: end avoids the need for a separate
rtl rule.

Can you not just keep all the existing stuff but add "position: fixed, bottom:
0"?

+  right: 0;
+}
+
+html[dir=rtl] .action-area {
+  bottom: 0;

[arv (Not doing code reviews), 2011/11/29 21:55:30]

no need to duplicate bottom, padding nor position.

+  left: 0;
+  padding: 12px;
+  position: absolute;
+  right: auto;
 }
 
 .button-strip {
   -webkit-box-orient: horizontal;
   display: -webkit-box;
 }
 
 .button-strip > button {
   -webkit-margin-start: 10px;
   display: block;
   white-space: nowrap;
 }
 
 .valid {
   background-image: url("chrome://theme/IDR_INPUT_GOOD");
   height: 21px;
   width: 22px;
 }
 
 .invalid {
   background-image: url("chrome://theme/IDR_INPUT_ALERT");
   height: 21px;
   width: 22px;
 }