Fix display when search engine names are very long

BUG=54101
TEST=Make a search engine name very long, and open DOMUI prefs. The <select> on the main page should not be wider than other controls, and text in the search engine manager table shouldn't overlap.

Review URL: http://codereview.chromium.org/3349007

git-svn-id: svn://svn.chromium.org/chrome/trunk/src@58393 0039d316-1c4b-4281-b951-d872f2087c98

3 files changed, 20 insertions, 1 deletions

diff --git a/chrome/browser/resources/options/browser_options.html b/chrome/browser/resources/options/browser_options.html
index 3e9a9c5..16262d2 100644
--- a/chrome/browser/resources/options/browser_options.html
+++ b/chrome/browser/resources/options/browser_options.html
@@ -56,7 +56,7 @@
   </section>
   <section>
     <h3 i18n-content="defaultSearchGroupName"></h3>
-    <div>
+    <div id="defaultSearchEngineGroup">
       <select id="defaultSearchEngine"
           onchange="BrowserOptions.getInstance().setDefaultSearchEngine()">
       </select>
diff --git a/chrome/browser/resources/options/browser_options_page.css b/chrome/browser/resources/options/browser_options_page.css
index 3021276..b2c1f27 100644
--- a/chrome/browser/resources/options/browser_options_page.css
+++ b/chrome/browser/resources/options/browser_options_page.css
@@ -7,6 +7,20 @@
   width: 100%;
 }
 
+#defaultSearchEngineGroup {
+  display: -webkit-box;
+}
+
+#defaultSearchEngine {
+  display: block;
+  -webkit-box-flex: 1;
+}
+
+#defaultSearchManageEnginesButton {
+  margin-top: 0px;
+  -webkit-margin-start: 10px;
+}
+
 #defaultBrowserState {
   color: #880000;
 }
diff --git a/chrome/browser/resources/options/search_engine_manager.css b/chrome/browser/resources/options/search_engine_manager.css
index 67e9a8d..4fa9268 100644
--- a/chrome/browser/resources/options/search_engine_manager.css
+++ b/chrome/browser/resources/options/search_engine_manager.css
@@ -19,6 +19,11 @@
   font-weight: bold;
 }
 
+#searchEngineList .name, #searchEngineList .keyword {
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
 #searchEngineHeading {
   font-weight: bold;
   padding: 4px;