Layout adjustment for i18n compatibility.

chrome/browser/resources/options/options_page.css

 body {
   cursor: default;
   font-size: 13px;
 }
 
 a:link {
   color: rgb(63, 110, 194);
 }
 
 a:active {
@@ skipping 335 matching lines @@
   font-size: 105%;
   font-weight: bold;
   padding: 10px 15px 8px 15px;
 }
 
 .page list {
   /* Min height is a multiple of the list item height (32) */
   min-height: 192px;
 }
 
+/**
+ * TODO(kevers): Standardize formatting of sections to use display tables.
+ * For now, we require separate specialized rules for sections that are 
+ * formatted as table rows. 
+ */
 section {
   -webkit-box-orient: horizontal;
   border-bottom: 1px solid #eeeeee;
   display: -webkit-box;
   margin-top: 17px;
   padding-bottom: 20px;
 }
 
 div.page section:last-child {
   border-bottom: none;
@@ skipping 404 matching lines @@
 
 html:not([hasFlashPlugin]) .flash-plugin-area,
 /* If the Flash plug-in supports the NPP_ClearSiteData API, we don't need to
  * show the link to the Flash storage settings manager:
  */
 html[flashPluginSupportsClearSiteData] .flash-plugin-area,
 html:not([flashPluginSupportsClearSiteData]) .clear-plugin-lso-data-enabled,
 html[flashPluginSupportsClearSiteData] .clear-plugin-lso-data-disabled {
   display: none;
 }
+
+
+/* Display a collection of sections as a table in order to display nicely
+ * in multiple locales.  The left column should expand to accomodate the
+ * widest label without introducing excessive whitespace.  Labels in
+ * languages such as German or Dutch tend to be wider than for English 
+ */
+.displaytable {
+  display: table;
+  width: 100%;
+}
+
+.displaytable > section {
+  display: table-row;
+}
+
+/* left table column containing section label */
+.displaytable > section > h3 {
+  display: table-cell;
+  vertical-align: baseline;
+}
+
+/* right table column containing settable options */
+.displaytable > section > h3 + div,
+.displaytable > section > h3 + table {
+  display: table-cell;
+  vertical-align: baseline;
+  padding-top: 17px;
+  padding-bottom: 20px;
+}
+
+.displaytable > section > * {
+  border-bottom: 1px solid #eeeeee;

[Rick Byers, 2011/06/08 17:55:36]

Can you also put display: table-cell and vertical-align: baseline here?  Then
you could remove the '.display > section > h3' rule and also omit those two
lines from the above rule.  I think that will take care of all the redundant
entries here.

[kevers, 2011/06/08 20:39:08]

Done.

+}
+
+/* do not display a border after the last section in the table */
+.displaytable > section:last-child > *  {
+  border-bottom: none;
+}