Standardize size of WebUI controls for touch and non-touch.

chrome/browser/resources/shared/css/widgets.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.
  */
 
 /* This file defines styles for form controls. The order of rule blocks is
  * important as there are some rules with equal specificity that rely on order
  * as a tiebreaker. These are marked with OVERRIDE.
  */
 
@@ skipping 47 matching lines @@
   -webkit-appearance: none;
   -webkit-padding-end: 20px;
   -webkit-padding-start: 6px;
   /* OVERRIDE */
   background-image: url('../images/select.png'),
       -webkit-linear-gradient(#ededed, #ededed 38%, #dedede);
   background-position: right center;
   background-repeat: no-repeat;
 }
 
+:-webkit-any(button,
+             input[type='button'],
+             input[type='submit'],
+             select):not(.custom-appearance):not(.link-button) {
+  margin-bottom: 3px;
+  margin-top: 2px;

[kevers, 2012/08/10 16:10:08]

Minimum margins for 28px vertical center to center distance on the settings
page.  Without this margin, controls in the "Appearance" and "Languages"
settings are packed too tightly for touch.

+}
+
 html[dir='rtl'] select {
   background-position: center left;
 }
 
 input[type='checkbox'] {
   bottom: 2px;
   height: 13px;
   position: relative;
   vertical-align: middle;
   width: 13px;
@@ skipping 206 matching lines @@
  * these classes with the markup structure:
  *
  *   <div class="checkbox">
  *     <label>
  *       <input type="checkbox"></input>
  *       <span>
  *     </label>
  *   </div>
  */
 
-.checkbox,
-.radio {
-  margin: 0.65em 0;
-}
-
 :-webkit-any(.checkbox, .radio) label {
   /* Don't expand horizontally: <http://crbug.com/112091>. */
   display: -webkit-inline-box;
+  padding-bottom: 7px;
+  padding-top: 7px;
 }
 
 :-webkit-any(.checkbox, .radio) label input ~ span {
   -webkit-margin-start: 0.6em;
   /* Make sure long spans wrap at the same horizontal position they start. */
   display: block;
 }
 
 :-webkit-any(.checkbox, .radio) label:hover {
   color: black;
 }
 
 label > input:disabled:-webkit-any([type='checkbox'], [type='radio']) ~ span {
   color: #999;
 }